:root {
      --bg: #F5F8FB;
      --card: #FFFFFF;
      --card-hover: #F8FBFF;
      --ink: #13202B;
      --ink-2: #2E3B48;
      --ink-muted: #657383;
      --ink-light: #9AA8B5;
      --line: #DDE7F0;
      --line-soft: #EAF0F5;
      --accent: #123D66;
      --accent-2: #0F5C99;
      --accent-bg: #EEF6FC;
      --accent-line: #C7DBEC;
      --gold: #A67C2E;
      --gold-bg: #FFF7E6;
      --gold-line: rgba(166,124,46,.22);
      --green: #22C55E;
      --green-dk: #0D5F2D;
      --green-bg: #ECFDF3;
      --red: #C0392B;
      --red-bg: #FEF0EE;
      --violet: #6D28D9;
      --violet-bg: #F6F0FF;
      --font-display: 'Manrope', system-ui, sans-serif;
      --font-body: 'Manrope', system-ui, sans-serif;
      --max: 1180px;
      --radius: 12px;
      --radius-lg: 18px;
      --shadow: 0 1px 2px rgba(15,36,54,.04), 0 12px 32px rgba(15,36,54,.07);
}

.home-map-card {
  display: grid;
  grid-template-columns: 84px minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  margin: 14px 0;
  padding: 13px 16px;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: #fff;
  box-shadow: var(--shadow);
}

.home-map-card .btn-accent {
  min-width: 138px;
  border-color: #C96A4A;
  background: #C96A4A;
  color: #fff;
  box-shadow: 0 3px 10px rgba(201, 106, 74, .16);
}

.home-map-card .btn-accent::before {
  content: "";
  width: 15px;
  height: 15px;
  background: #fff;
  -webkit-mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 21s7-5.4 7-11a7 7 0 1 0-14 0c0 5.6 7 11 7 11Z' stroke='black' stroke-width='2'/%3E%3Ccircle cx='12' cy='10' r='2.5' stroke='black' stroke-width='2'/%3E%3C/svg%3E") center/contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 21s7-5.4 7-11a7 7 0 1 0-14 0c0 5.6 7 11 7 11Z' stroke='black' stroke-width='2'/%3E%3Ccircle cx='12' cy='10' r='2.5' stroke='black' stroke-width='2'/%3E%3C/svg%3E") center/contain no-repeat;
}

.home-map-card .btn-accent:hover {
  background: #B95638;
  border-color: #B95638;
  color: #fff;
}

.home-map-visual {
  min-height: 62px;
  border: 1px solid #d7e5df;
  border-radius: 12px;
  background:
    linear-gradient(135deg, rgba(111, 155, 122, .14), rgba(6, 48, 71, .08)),
    radial-gradient(circle at 70% 35%, rgba(0, 107, 87, .18), transparent 28%);
  display: grid;
  place-items: center;
}

.home-map-visual span {
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  background: #063047;
  color: #fff;
  font-size: 13px;
  font-weight: 850;
}

.home-map-card h2 {
  margin: 0;
  color: var(--ink);
  font-family: var(--font-display);
  font-size: 20px;
  line-height: 1.15;
  font-weight: 850;
}

.home-map-card p:not(.home-free-kicker) {
  margin: 4px 0 0;
  color: var(--ink-muted);
  font-size: 14px;
}

.module-map-cta {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  width: fit-content;
  min-height: 34px;
  margin-top: 11px;
  padding: 0 13px;
  border: 1px solid #C96A4A;
  border-radius: 999px;
  background: #C96A4A;
  color: #fff;
  font-size: 13px;
  font-weight: 850;
  text-decoration: none;
  transition: background .14s ease, border-color .14s ease, transform .14s ease;
}

.module-map-cta::before {
  content: "";
  width: 15px;
  height: 15px;
  flex: 0 0 auto;
  background: #fff;
  -webkit-mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 21s7-5.4 7-11a7 7 0 1 0-14 0c0 5.6 7 11 7 11Z' stroke='black' stroke-width='2'/%3E%3Ccircle cx='12' cy='10' r='2.5' stroke='black' stroke-width='2'/%3E%3C/svg%3E") center/contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 21s7-5.4 7-11a7 7 0 1 0-14 0c0 5.6 7 11 7 11Z' stroke='black' stroke-width='2'/%3E%3Ccircle cx='12' cy='10' r='2.5' stroke='black' stroke-width='2'/%3E%3C/svg%3E") center/contain no-repeat;
}

.module-map-cta:hover {
  border-color: #B95638;
  background: #B95638;
  color: #fff;
  transform: translateY(-1px);
}

@media (max-width: 768px) {
  .home-map-card {
    grid-template-columns: 64px minmax(0, 1fr);
    gap: 10px;
    margin: 12px 0;
    padding: 11px;
  }

  .home-map-card .btn {
    grid-column: 1 / -1;
    width: 100%;
  }

  .module-map-cta {
    width: 100%;
    justify-content: center;
  }

  .home-map-visual {
    min-height: 56px;
  }
}
    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
    html { scroll-behavior: smooth; }
    body { font-family: var(--font-body); background: linear-gradient(180deg, #F8FBFE 0%, var(--bg) 280px); color: var(--ink); line-height: 1.5; -webkit-font-smoothing: antialiased; }
    a { color: inherit; text-decoration: none; }
    button, input, select, textarea { font: inherit; }
    button { cursor: pointer; border: 0; background: none; }
    :focus-visible { outline: 3px solid rgba(15,92,153,.18); outline-offset: 2px; }
    .w { max-width: var(--max); margin: 0 auto; padding-left: 20px; padding-right: 20px; }
    .topbar { position: sticky; top: 0; z-index: 90; background: rgba(255,255,255,.92); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); border-bottom: 1px solid rgba(199,219,236,.8); }
    .topbar .w { min-height: 60px; display: flex; align-items: center; gap: 14px; }
    .logo { display: flex; align-items: center; gap: 9px; flex-shrink: 0; }
    .logo-mark { width: 34px; height: 34px; border-radius: 11px; background: linear-gradient(135deg, var(--accent), var(--accent-2)); color: #fff; display: grid; place-items: center; font-family: var(--font-display); font-weight: 800; font-size: 12px; letter-spacing: -.04em; box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 6px 14px rgba(18,61,102,.13); }
    .logo-text { font-family: var(--font-display); font-size: 17px; font-weight: 750; letter-spacing: -.03em; white-space: nowrap; }
    .search-wrap { flex: 1; max-width: 520px; margin: 0 auto; position: relative; }
    .search-wrap svg { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); width: 16px; height: 16px; color: var(--ink-light); pointer-events: none; }
    .search-wrap input { width: 100%; height: 40px; border: 1px solid var(--line); border-radius: 999px; background: #fff; padding: 0 14px 0 38px; font-size: 13px; font-weight: 500; color: var(--ink); outline: none; }
    .search-wrap input:focus { border-color: var(--accent-line); box-shadow: 0 0 0 4px rgba(15,92,153,.08); }
    .top-actions { display: flex; gap: 8px; flex-shrink: 0; }
    .btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 36px; padding: 0 15px; border-radius: 999px; font-size: 13px; font-weight: 760; white-space: nowrap; border: 1px solid var(--line); background: #fff; color: var(--ink); transition: transform .12s ease, border-color .12s ease, background .12s ease, box-shadow .12s ease; }
    .btn:hover { border-color: var(--accent-line); background: var(--card-hover); transform: translateY(-1px); }
    .btn-accent { background: var(--accent); border-color: var(--accent); color: #fff; box-shadow: 0 8px 16px rgba(18,61,102,.12); }
    .btn-accent:hover { background: var(--accent-2); border-color: var(--accent-2); }
    .btn-wa { background: #25D366; border-color: #25D366; color: #063F1D; font-weight: 850; }
    .btn-share { background: #FFF7EF; border-color: rgba(216,111,50,.34); color: #9B4A1F; font-weight: 820; }
    .btn-share:hover { background: #FFEBDD; border-color: rgba(216,111,50,.52); color: #783614; }
    .btn-sm { min-height: 31px; padding: 0 11px; font-size: 12px; }
    .btn-ghost { background: #fff; color: var(--accent); border-color: var(--accent-line); }
    .btn-soft { background: var(--accent-bg); border-color: var(--accent-line); color: var(--accent); }
    .btn-wide { width: 100%; }
    .zones { background: rgba(255,255,255,.78); border-bottom: 1px solid var(--line-soft); }
    .zones .w { display: flex; gap: 1px; overflow-x: auto; scrollbar-width: none; }
    .zones .w::-webkit-scrollbar { display: none; }
    .zone-btn { padding: 10px 14px; font-size: 12px; font-weight: 650; color: var(--ink-muted); white-space: nowrap; position: relative; transition: color .12s; }
    .zone-btn:hover { color: var(--ink); }
    .zone-btn.on { color: var(--accent); font-weight: 800; }
    .zone-btn.on::after { content: ''; position: absolute; bottom: 0; left: 12px; right: 12px; height: 2px; background: var(--accent-2); border-radius: 2px 2px 0 0; }
    .module-strip { padding: 14px 0 0; }
    .module-links { display: grid; grid-template-columns: repeat(8, 1fr); background: #fff; border: 1px solid var(--line); border-radius: var(--radius-lg); overflow: hidden; box-shadow: 0 1px 2px rgba(15,36,54,.025); }
    .module-link { padding: 11px 12px; border-right: 1px solid var(--line-soft); font-size: 12px; font-weight: 800; color: var(--ink-muted); display: flex; flex-direction: column; gap: 2px; }
    .module-link:last-child { border-right: 0; }
    .module-link span { font-size: 10.5px; font-weight: 600; color: var(--ink-light); }
    .module-link:hover { background: var(--card-hover); color: var(--ink); }
    .module-link.on { color: var(--accent); background: linear-gradient(180deg, #F4FAFF, #FFFFFF); box-shadow: inset 0 -3px 0 var(--accent-2); }
    .page { padding: 18px 0 36px; }
    .hero { background: #fff; border: 1px solid var(--line); border-radius: var(--radius-lg); box-shadow: var(--shadow); overflow: hidden; }
    .hero-main { padding: 20px 20px 18px; display: grid; grid-template-columns: 1fr auto; gap: 18px; align-items: center; }
    .crumb { display: inline-flex; align-items: center; gap: 7px; color: var(--accent); font-size: 12px; font-weight: 800; margin-bottom: 8px; }
    .hero h1 { font-family: var(--font-display); font-size: 30px; line-height: 1.04; letter-spacing: -.045em; font-weight: 850; }
    .hero p { color: var(--ink-muted); font-size: 14px; margin-top: 5px; max-width: 690px; }
    .hero-actions { display: flex; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
    .hero-stats { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line-soft); background: #FBFDFF; }
    .stat { padding: 11px 18px; border-right: 1px solid var(--line-soft); }
    .stat:last-child { border-right: 0; }
    .stat strong { display: block; font-family: var(--font-display); font-size: 18px; color: var(--accent); letter-spacing: -.02em; }
    .stat span { display: block; color: var(--ink-muted); font-size: 11px; margin-top: 1px; }
    .content-grid { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 16px; margin-top: 16px; align-items: start; }
    .panel { background: #fff; border: 1px solid var(--line); border-radius: var(--radius-lg); box-shadow: var(--shadow); overflow: hidden; }
    .panel-head { padding: 14px 16px; border-bottom: 1px solid var(--line-soft); display: flex; justify-content: space-between; gap: 12px; align-items: center; background: linear-gradient(180deg, #FFFFFF, #FBFDFF); }
    .panel-head h2 { font-family: var(--font-display); font-size: 17px; letter-spacing: -.025em; font-weight: 800; }
    .panel-head p { color: var(--ink-muted); font-size: 12px; margin-top: 1px; }
    .count { font-size: 12px; font-weight: 800; color: var(--accent); background: var(--accent-bg); border: 1px solid var(--accent-line); padding: 5px 9px; border-radius: 999px; white-space: nowrap; }
    .filters { padding: 12px 16px; border-bottom: 1px solid var(--line-soft); display: grid; grid-template-columns: minmax(220px, 1fr) 180px 180px; gap: 8px; background: #FBFDFF; }
    .filter-input, .filter-select { width: 100%; height: 40px; border: 1px solid var(--line); border-radius: 12px; background: #fff; color: var(--ink); padding: 0 12px; font-size: 13px; outline: none; }
    .filter-input:focus, .filter-select:focus { border-color: var(--accent-line); box-shadow: 0 0 0 4px rgba(15,92,153,.08); }
    .item { display: grid; grid-template-columns: 64px 1fr auto; gap: 14px; padding: 16px; border-bottom: 2px solid rgba(166,190,184,.36); align-items: start; transition: background .1s; }
    .item[data-card-open="detail"],
    .kids-card[data-card-open="detail"] { cursor: pointer; }
    .item[data-card-open="detail"]:focus-visible,
    .kids-card[data-card-open="detail"]:focus-visible { outline: 3px solid rgba(216,111,50,.28); outline-offset: -3px; background: #FAFBF8; }
    .item:hover { background: var(--card-hover); }
    .badge { width: 64px; height: 54px; border-radius: 14px; display: grid; place-items: center; text-align: center; font-weight: 850; line-height: 1; overflow: hidden; }
    .badge .big { display: block; font-size: 20px; letter-spacing: -.04em; }
    .badge .small { display: block; font-size: 9px; text-transform: uppercase; letter-spacing: .06em; margin-top: 2px; }
    .badge.gold, .badge.promo { background: var(--gold-bg); color: var(--gold); border: 1px solid var(--gold-line); }
    .badge.blue { background: var(--accent-bg); color: var(--accent); border: 1px solid var(--accent-line); }
    .badge.green { background: var(--green-bg); color: var(--green-dk); border: 1px solid rgba(13,95,45,.14); }
    .badge.violet { background: var(--violet-bg); color: var(--violet); border: 1px solid rgba(109,40,217,.14); }
    .badge.icon { background: var(--accent-bg); color: var(--accent); border: 1px solid var(--accent-line); font-size: 24px; }
    .badge.avatar { border-radius: 999px; width: 50px; height: 50px; background: linear-gradient(180deg, #F4F8FC, #EEF3F8); color: var(--accent); border: 1px solid var(--line); font-size: 14px; }
    .card-thumb { width: 64px; height: 54px; border-radius: 14px; object-fit: cover; display: block; background: linear-gradient(180deg, #F4F8FC, #EEF3F8); border: 1px solid var(--line); box-sizing: border-box; overflow: hidden; }
    .media-placeholder {
      display: grid;
      place-items: center;
      color: var(--ink-muted);
      background: linear-gradient(180deg, #F7FAFD, #EEF3F8);
      border: 1px dashed var(--accent-line);
      font-size: 10px;
      font-weight: 900;
      text-align: center;
      text-transform: uppercase;
      line-height: 1.15;
      padding: 4px;
    }
    .item h3 { font-family: var(--font-display); font-size: 16px; font-weight: 800; letter-spacing: -.025em; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
    .item p { color: var(--ink-muted); font-size: 13px; margin-top: 3px; line-height: 1.42; }
    .meta { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 8px; }
    .tag { display: inline-flex; align-items: center; min-height: 20px; padding: 3px 8px; border-radius: 999px; font-size: 10px; font-weight: 850; letter-spacing: .02em; }
    .t-zone { background: #F2F5F8; color: var(--ink-muted); }
    .t-rubro { background: var(--accent-bg); color: var(--accent); }
    .t-gold { background: var(--gold-bg); color: var(--gold); }
    .t-green { background: var(--green-bg); color: var(--green-dk); }
    .t-red { background: var(--red-bg); color: var(--red); }
    .actions { display: flex; flex-wrap: wrap; gap: 7px; align-items: center; justify-content: flex-end; min-width: 218px; }
    .actions .btn { white-space: nowrap; }
    .recommendation-widget { position: relative; display: inline-grid; gap: 4px; justify-items: end; max-width: 190px; }
    .recommendation-summary { display: grid; gap: 2px; margin-top: 8px; color: var(--ink-muted); font-size: 12px; font-weight: 760; line-height: 1.3; }
    .recommendation-summary [hidden] { display: none !important; }
    .recommendation-summary [data-recommendation-summary-count] { color: var(--ink); }
    .recommendation-summary [data-recommendation-summary-highlights] { color: #8A421D; font-size: 11.5px; }
    .actions .recommendation-widget > .recommendation-count,
    .actions .recommendation-widget > .recommendation-highlights,
    .kids-card-actions .recommendation-widget > .recommendation-count,
    .kids-card-actions .recommendation-widget > .recommendation-highlights,
    .recommendation-detail-widget .recommendation-widget > .recommendation-count,
    .recommendation-detail-widget .recommendation-widget > .recommendation-highlights { display: none !important; }
    .recommendation-control { position: relative; width: 100%; display: grid; justify-items: end; }
    .btn-recommend { border-color: rgba(216,111,50,.34); background: #FFF8F2; color: #8A421D; font-weight: 840; }
    .btn-recommend:hover,
    .btn-recommend:focus-visible { border-color: rgba(216,111,50,.56); background: #FFEBDD; color: #6F3113; }
    .btn-recommend.is-recommended { border-color: rgba(10,115,88,.32); background: #EAF7F1; color: #075B45; }
    .recommendation-menu { position: absolute; right: 0; top: calc(100% + 8px); z-index: 42; min-width: 190px; display: grid; gap: 4px; padding: 6px; border: 1px solid var(--line); border-radius: 14px; background: #fff; box-shadow: 0 16px 42px rgba(2,35,43,.18); }
    .recommendation-menu[hidden] { display: none; }
    .recommendation-menu::before { content: ""; position: absolute; top: -6px; right: 22px; width: 10px; height: 10px; border-left: 1px solid var(--line); border-top: 1px solid var(--line); background: #fff; transform: rotate(45deg); }
    .recommendation-menu-item { min-height: 36px; border: 0; border-radius: 10px; background: transparent; color: var(--ink); padding: 8px 10px; font-size: 12px; font-weight: 820; text-align: left; cursor: pointer; }
    .recommendation-menu-item:hover,
    .recommendation-menu-item:focus-visible { background: var(--accent-bg); color: var(--accent); }
    .recommendation-menu-item.is-danger { color: #8A421D; }
    .recommendation-count { color: var(--ink-muted); font-size: 11.5px; font-weight: 760; line-height: 1.25; text-align: right; }
    .recommendation-highlights { color: #8A421D; font-size: 11px; font-weight: 760; line-height: 1.25; text-align: right; max-width: 170px; }
    .recommendation-toast { position: fixed; right: 18px; bottom: 22px; z-index: 900; max-width: min(360px, calc(100vw - 28px)); padding: 11px 14px; border: 1px solid rgba(216,111,50,.28); border-radius: 14px; background: #fff; color: var(--ink); box-shadow: 0 18px 44px rgba(2,35,43,.16); font-size: 13px; font-weight: 760; line-height: 1.35; }
    .recommendation-reason-overlay,
    .recommendation-detail-overlay { position: fixed; inset: 0; z-index: 790; display: flex; align-items: center; justify-content: center; padding: 18px; background: rgba(12,32,39,.34); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }
    .recommendation-reason-overlay[hidden],
    .recommendation-detail-overlay[hidden] { display: none; }
    .recommendation-reason-sheet,
    .recommendation-detail-sheet { position: relative; width: min(420px, 100%); max-height: min(680px, calc(100dvh - 36px)); overflow-y: auto; border: 1px solid var(--line); border-radius: 20px; background: #fff; box-shadow: 0 24px 70px rgba(2,35,43,.24); padding: 20px; touch-action: pan-y; }
    .sheet-handle,
    .modal-drag-handle,
    .share-dialog-handle { display: none; width: 42px; height: 4px; border-radius: 999px; background: rgba(4,63,77,.18); margin: 0 auto 12px; }
    .sheet-close { position: absolute; top: 12px; right: 12px; width: 34px; height: 34px; border: 1px solid var(--line); border-radius: 50%; background: #fff; color: var(--ink-muted); font-size: 22px; line-height: 1; display: grid; place-items: center; }
    .recommendation-reason-sheet h2,
    .recommendation-detail-sheet h2 { font-family: var(--font-display); font-size: 22px; line-height: 1.15; letter-spacing: 0; padding-right: 34px; }
    .recommendation-reason-sheet p,
    .recommendation-detail-sheet p { margin-top: 7px; color: var(--ink-muted); font-size: 13px; line-height: 1.45; }
    .recommendation-reason-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
    .recommendation-reason-chip { min-height: 36px; border: 1px solid var(--line); border-radius: 999px; padding: 0 13px; background: #fff; color: var(--ink); font-size: 12px; font-weight: 820; }
    .recommendation-reason-chip.is-selected { border-color: rgba(216,111,50,.52); background: #FFF1E7; color: #8A421D; box-shadow: inset 0 0 0 1px rgba(216,111,50,.18); }
    .recommendation-reason-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 18px; }
    .recommendation-detail-hero { display: grid; grid-template-columns: 86px minmax(0, 1fr); gap: 14px; align-items: center; padding-right: 34px; }
    .recommendation-detail-photo,
    .recommendation-detail-media,
    .recommendation-detail-avatar { width: 86px; height: 76px; border: 1px solid var(--line); border-radius: 16px; background: var(--accent-bg); box-shadow: inset 0 0 0 1px rgba(255,255,255,.72); }
    .recommendation-detail-photo { position: relative; display: block; padding: 0; overflow: hidden; cursor: zoom-in; }
    .recommendation-detail-media { display: block; object-fit: cover; }
    .recommendation-detail-photo .recommendation-detail-media { width: 100%; height: 100%; border: 0; border-radius: 0; box-shadow: none; }
    .recommendation-detail-photo-zoom { position: absolute; left: 8px; right: 8px; bottom: 8px; display: inline-flex; justify-content: center; min-height: 24px; align-items: center; border-radius: 999px; background: rgba(3,38,47,.72); color: #fff; font-size: 11px; font-weight: 850; line-height: 1; }
    .recommendation-detail-avatar { display: grid; place-items: center; color: var(--accent); font-weight: 950; letter-spacing: .04em; }
    .recommendation-detail-gallery { display: flex; gap: 8px; margin-top: 12px; padding-bottom: 2px; overflow-x: auto; overscroll-behavior-x: contain; }
    .recommendation-detail-gallery-thumb { flex: 0 0 64px; width: 64px; height: 48px; border: 1px solid var(--line); border-radius: 12px; padding: 0; background: #fff; overflow: hidden; cursor: pointer; opacity: .76; }
    .recommendation-detail-gallery-thumb.is-active { border-color: rgba(216,111,50,.64); opacity: 1; box-shadow: 0 0 0 2px rgba(216,111,50,.12); }
    .recommendation-detail-gallery-thumb img { width: 100%; height: 100%; display: block; object-fit: cover; }
    .recommendation-detail-titleblock { min-width: 0; }
    .recommendation-detail-titleblock h2 { padding-right: 0; }
    .recommendation-detail-kicker { color: var(--accent); font-size: 11px; font-weight: 900; letter-spacing: .04em; text-transform: uppercase; }
    .recommendation-detail-meta { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
    .recommendation-detail-meta span { min-height: 24px; display: inline-flex; align-items: center; border-radius: 999px; background: var(--accent-bg); color: var(--accent); padding: 4px 9px; font-size: 11px; font-weight: 820; }
    .recommendation-detail-score { margin-top: 14px; border: 1px solid rgba(216,111,50,.22); border-radius: 14px; background: #FFF8F2; color: #8A421D; padding: 11px 12px; font-size: 14px; font-weight: 850; }
    .recommendation-detail-nudge { margin-top: 14px; border: 1px solid var(--line-soft); border-radius: 14px; background: #FAFCF9; padding: 12px; color: var(--ink-muted); font-size: 13px; line-height: 1.35; }
    .recommendation-detail-nudge strong { display: block; margin-bottom: 3px; color: var(--ink); font-size: 14px; }
    .recommendation-detail-reasons { margin-top: 14px; display: grid; gap: 7px; }
    .recommendation-detail-reasons strong { font-size: 13px; color: var(--ink); }
    .recommendation-detail-reason-row { display: flex; justify-content: space-between; gap: 16px; border: 1px solid var(--line-soft); border-radius: 12px; padding: 9px 11px; color: var(--ink-muted); font-size: 13px; font-weight: 740; }
    .recommendation-detail-reason-row b { color: var(--ink); }
    .recommendation-detail-widget { margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--line-soft); }
    .recommendation-detail-widget .recommendation-widget { max-width: none; justify-items: stretch; width: 100%; }
    .recommendation-detail-widget .recommendation-control,
    .recommendation-detail-widget .btn-recommend { width: 100%; }
    .recommendation-detail-widget .recommendation-count,
    .recommendation-detail-widget .recommendation-highlights { text-align: left; max-width: none; }
    .recommendation-detail-actions { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 16px; }
    .recommendation-detail-actions .btn { min-height: 38px; }
    .dc-lightbox-overlay { position: fixed; inset: 0; z-index: 940; display: grid; place-items: center; padding: 22px; background: rgba(4,24,30,.82); }
    .dc-lightbox-overlay[hidden] { display: none; }
    .dc-lightbox-frame { position: relative; width: min(1080px, 100%); height: min(760px, calc(100dvh - 44px)); display: grid; place-items: center; }
    .dc-lightbox-figure { width: 100%; height: 100%; display: grid; grid-template-rows: minmax(0, 1fr) auto; align-items: center; justify-items: center; gap: 10px; margin: 0; }
    .dc-lightbox-image { max-width: 100%; max-height: 100%; object-fit: contain; border-radius: 10px; box-shadow: 0 26px 80px rgba(0,0,0,.36); background: #10252B; }
    .dc-lightbox-figure figcaption { min-height: 20px; color: rgba(255,255,255,.82); font-size: 13px; font-weight: 760; }
    .dc-lightbox-close,
    .dc-lightbox-nav { position: absolute; z-index: 2; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.34); border-radius: 999px; background: rgba(255,255,255,.94); color: #12343D; box-shadow: 0 12px 34px rgba(0,0,0,.22); }
    .dc-lightbox-close { top: 0; right: 0; width: 42px; height: 42px; font-size: 28px; line-height: 1; }
    .dc-lightbox-nav { top: 50%; width: 44px; height: 44px; transform: translateY(-50%); font-size: 34px; line-height: 1; }
    .dc-lightbox-prev { left: 0; }
    .dc-lightbox-next { right: 0; }

    .share-overlay { position: fixed; inset: 0; z-index: 760; display: flex; align-items: center; justify-content: center; padding: 18px; background: rgba(12,32,39,.34); opacity: 0; pointer-events: none; transition: opacity .16s ease; }
    .share-overlay.is-open { opacity: 1; pointer-events: auto; }
    .share-dialog { width: min(360px, 100%); border: 1px solid var(--line); border-radius: 18px; background: #fff; box-shadow: 0 22px 60px rgba(2,35,43,.2); overflow: hidden; }
    .share-dialog__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; padding: 17px 18px 12px; border-bottom: 1px solid var(--line-soft); }
    .share-dialog__head strong { display: block; color: var(--ink); font-size: 18px; line-height: 1.15; }
    .share-dialog__head p { margin: 4px 0 0; color: var(--ink-muted); font-size: 13px; line-height: 1.35; }
    .share-close { width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 50%; background: #fff; color: var(--ink); font-size: 22px; line-height: 1; cursor: pointer; }
    .share-dialog__actions { display: grid; gap: 9px; padding: 14px 18px 8px; }
    .share-dialog__actions .btn { width: 100%; min-height: 42px; }
    .share-status { min-height: 18px; margin: 0; padding: 0 18px 16px; color: var(--ink-muted); font-size: 12px; text-align: center; }
    body.dc-scroll-locked { overscroll-behavior: contain; }
    .public-detail-overlay { position: fixed; inset: 0; z-index: 755; display: flex; align-items: center; justify-content: center; padding: 18px; background: rgba(12,32,39,.34); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }
    .public-detail-overlay[hidden] { display: none; }
    .public-detail-sheet { position: relative; width: min(560px, 100%); max-height: min(680px, calc(100dvh - 36px)); overflow-y: auto; border: 1px solid var(--line); border-radius: 20px; background: #fff; box-shadow: 0 24px 70px rgba(2,35,43,.22); padding: 20px; touch-action: pan-y; }
    .public-detail-kicker { color: var(--accent); font-size: 11px; font-weight: 900; letter-spacing: .04em; text-transform: uppercase; }
    .public-detail-sheet h2 { font-family: var(--font-display); font-size: 22px; line-height: 1.15; letter-spacing: 0; padding-right: 34px; }
    .public-detail-sheet p { margin-top: 8px; color: var(--ink-muted); font-size: 13px; line-height: 1.45; }
    .public-detail-meta { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
    .public-detail-meta span { min-height: 24px; display: inline-flex; align-items: center; border-radius: 999px; background: var(--accent-bg); color: var(--accent); padding: 4px 9px; font-size: 11px; font-weight: 820; }
    .public-detail-note { margin-top: 14px; border: 1px solid var(--line-soft); border-radius: 14px; background: #FAFCF9; padding: 11px 12px; color: var(--ink-muted); font-size: 13px; line-height: 1.4; }
    .public-detail-answers { display: grid; gap: 8px; margin-top: 12px; }
    .public-detail-answer { border: 1px solid var(--line-soft); border-radius: 14px; background: #fff; padding: 11px 12px; }
    .public-detail-answer p { margin: 0; color: var(--ink); font-size: 13px; line-height: 1.4; }
    .public-detail-answer span { display: block; margin-top: 6px; color: var(--ink-muted); font-size: 11px; font-weight: 760; }
    .public-detail-empty-answer { margin-top: 12px; border: 1px dashed var(--line); border-radius: 14px; background: #F9FCFA; color: var(--ink-muted); font-size: 13px; line-height: 1.4; padding: 12px; }
    .public-detail-answer-form { display: grid; gap: 9px; margin-top: 14px; border: 1px solid var(--line-soft); border-radius: 14px; background: #F9FCFA; padding: 12px; }
    .public-detail-answer-form[hidden] { display: none; }
    .public-detail-answer-form label { color: var(--ink); font-size: 12px; font-weight: 850; }
    .public-detail-answer-form textarea { width: 100%; min-height: 104px; resize: vertical; border: 1px solid var(--line); border-radius: 12px; padding: 10px 11px; color: var(--ink); font: inherit; line-height: 1.4; background: #fff; }
    .public-detail-answer-form textarea:focus { outline: 2px solid rgba(216,111,50,.18); border-color: rgba(216,111,50,.52); }
    .public-detail-answer-message { color: var(--ink-muted); font-size: 12px; font-weight: 760; }
    .public-detail-answer-message[data-tone="error"] { color: #9D2E2E; }
    .public-detail-answer-actions { display: flex; flex-wrap: wrap; gap: 8px; }
    .public-detail-actions { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 16px; }
    .code { font-size: 11px; font-weight: 900; letter-spacing: .05em; color: var(--gold); background: var(--gold-bg); border: 1.5px dashed var(--gold-line); padding: 5px 9px; border-radius: 8px; }
    .side { display: flex; flex-direction: column; gap: 12px; }
    .side-box { background: #fff; border: 1px solid var(--line); border-radius: var(--radius-lg); box-shadow: var(--shadow); overflow: hidden; }
    .side-pad { padding: 16px; }
    .side-box h3 { font-family: var(--font-display); font-size: 16px; font-weight: 800; letter-spacing: -.02em; }
    .side-box p { color: var(--ink-muted); font-size: 12px; margin-top: 5px; line-height: 1.45; }
    .side-list { margin-top: 12px; display: flex; flex-direction: column; gap: 8px; }
    .side-row { display: flex; justify-content: space-between; gap: 10px; padding: 9px 0; border-top: 1px solid var(--line-soft); font-size: 12px; color: var(--ink-muted); }
    .side-row strong { color: var(--ink); font-size: 12.5px; }
    .publish-box { background: linear-gradient(135deg, var(--accent), var(--accent-2)); color: #fff; border: 0; }
    .publish-box p { color: rgba(255,255,255,.78); }
    .publish-box .btn { margin-top: 12px; background: #fff; color: var(--accent); border-color: rgba(255,255,255,.55); }
    .notice { background: #F8FBFF; border: 1px solid var(--line); border-radius: 14px; padding: 12px; font-size: 12px; color: var(--ink-muted); line-height: 1.45; }
    .notice strong { color: var(--accent); }
    .empty-state { display: none; padding: 28px 16px; color: var(--ink-muted); text-align: center; font-size: 13px; }
    .empty-state.show { display: block; }
    .empty-state .clear-filters { margin-top: 12px; }
    .empty-state.show,
    .account-state {
      overflow-wrap: anywhere;
    }
    footer { border-top: 1px solid var(--line); background: #fff; padding: 20px 0; margin-top: 22px; }
    .footer-inner { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; flex-wrap: wrap; }
    .footer-brand { font-family: var(--font-display); font-size: 14px; font-weight: 800; }
    .footer-legal { font-size: 11px; color: var(--ink-light); max-width: 580px; margin-top: 4px; }
    .footer-links { display: flex; gap: 14px; }
    .footer-links a,
    .footer-link { font-size: 11px; font-weight: 650; color: var(--ink-muted); }
    .footer-link { padding: 0; cursor: pointer; }
    .footer-link:hover { color: var(--accent); }
    .modal-overlay { position: fixed; inset: 0; z-index: 200; background: rgba(19,32,43,.32); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); display: flex; align-items: center; justify-content: center; padding: 20px; opacity: 0; pointer-events: none; transition: opacity .2s ease; }
    .modal-overlay.open { opacity: 1; pointer-events: auto; }
    .modal { background: #fff; border-radius: 18px; box-shadow: 0 18px 54px rgba(15,36,54,.16), 0 2px 8px rgba(15,36,54,.06); width: 100%; max-width: 400px; transform: translateY(12px) scale(.98); transition: transform .25s ease; overflow: hidden; }
    .modal-overlay.open .modal { transform: translateY(0) scale(1); }
    .modal-top { padding: 22px 22px 0; display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
    .modal-top h2 { font-family: var(--font-display); font-size: 20px; font-weight: 820; letter-spacing: 0; }
    .modal-top p { font-size: 13px; color: var(--ink-muted); margin-top: 5px; line-height: 1.4; }
    .modal-close { width: 32px; height: 32px; border-radius: 10px; display: grid; place-items: center; color: var(--ink-muted); font-size: 18px; }
    .modal-close:hover { background: var(--line-soft); }
    .modal-tabs { display: flex; gap: 0; margin: 18px 22px 0; border: 1px solid var(--line); border-radius: 999px; padding: 3px; background: #F7FAF8; }
    .modal-tab { flex: 1; min-height: 34px; padding: 0 8px; border-radius: 999px; font-size: 12.5px; font-weight: 760; color: var(--ink-muted); text-align: center; }
    .modal-tab.on { color: #fff; background: var(--accent); box-shadow: 0 1px 2px rgba(0,0,0,.04); }
    .modal-body { padding: 20px 22px 22px; }
    .modal-footer { padding: 13px 22px; border-top: 1px solid var(--line-soft); font-size: 11px; color: var(--ink-light); text-align: center; line-height: 1.45; }
    .modal-account-actions { display: grid; gap: 10px; }
    .auth-intent-panel { display: grid; gap: 14px; }
    .auth-intent-copy { margin: 0; color: var(--ink-muted); font-size: 13px; line-height: 1.45; }
    .auth-intent-primary-actions { gap: 9px; }
    .auth-intent-action { min-height: 44px; justify-content: center; }
    .auth-intent-message { border: 1px solid var(--accent-line); border-radius: 12px; background: var(--card-hover); color: var(--ink-muted); font-size: 12px; line-height: 1.4; padding: 10px 12px; }
    .free-highlight {
      color: #13A75A;
      font-weight: 850;
    }
    .public-toast {
      position: fixed;
      right: 18px;
      bottom: 18px;
      z-index: 260;
      max-width: min(360px, calc(100vw - 28px));
      border: 1px solid var(--accent-line);
      border-radius: 14px;
      padding: 12px 14px;
      background: #fff;
      color: var(--ink-2);
      box-shadow: var(--shadow);
      font-size: 13px;
      font-weight: 750;
      line-height: 1.4;
    }
    @media (max-width: 920px) {
      .content-grid { grid-template-columns: 1fr; }
      .side { display: grid; grid-template-columns: 1fr 1fr; }
      .publish-box { grid-column: 1 / -1; }
      .filters { grid-template-columns: 1fr 1fr; }
      .filters .filter-input { grid-column: 1 / -1; }
      .hero-main { grid-template-columns: 1fr; }
      .hero-actions { justify-content: flex-start; }
    }
    @media (max-width: 760px) {
      .module-links { grid-template-columns: repeat(8, minmax(132px, 1fr)); overflow-x: auto; }
    }
    @media (max-width: 680px) {
      .w { padding-left: 14px; padding-right: 14px; }
      .topbar .w { min-height: auto; gap: 10px; padding-top: 10px; padding-bottom: 10px; flex-wrap: wrap; }
      .logo-text { font-size: 15px; }
      .top-actions .hide-m { display: none; }
      .search-wrap { order: 3; flex: 1 0 100%; max-width: none; margin: 0; }
      .hero h1 { font-size: 25px; }
      .hero-stats { grid-template-columns: 1fr; }
      .stat { border-right: 0; border-bottom: 1px solid var(--line-soft); }
      .stat:last-child { border-bottom: 0; }
      .filters { grid-template-columns: 1fr; }
      .item { grid-template-columns: 52px 1fr; gap: 11px; padding: 14px; }
      .badge { width: 52px; height: 46px; border-radius: 13px; }
      .badge.avatar { width: 44px; height: 44px; }
      .card-thumb { width: 52px; height: 46px; border-radius: 13px; }
      .actions { grid-column: 1 / -1; flex-direction: row; align-items: center; justify-content: flex-start; min-width: 0; flex-wrap: wrap; }
      .recommendation-widget { justify-items: stretch; flex: 1 1 160px; max-width: none; }
      .recommendation-control,
      .recommendation-widget .btn-recommend { width: 100%; }
      .recommendation-count,
      .recommendation-highlights { text-align: left; max-width: 100%; }
      .recommendation-menu { left: 0; right: auto; min-width: min(220px, 100%); }
      .recommendation-menu::before { left: 22px; right: auto; }
      .recommendation-reason-overlay,
      .recommendation-detail-overlay,
      .public-detail-overlay { align-items: flex-end; padding: 0; }
      .recommendation-reason-sheet,
      .recommendation-detail-sheet,
      .public-detail-sheet { width: 100%; max-height: min(82dvh, 720px); border-radius: 20px 20px 0 0; padding: 16px 16px calc(18px + env(safe-area-inset-bottom)); }
      .sheet-handle { display: block; }
      .recommendation-reason-actions,
      .recommendation-detail-actions { grid-template-columns: 1fr; }
      .recommendation-detail-actions .btn { width: 100%; }
      .recommendation-detail-hero { grid-template-columns: 72px minmax(0, 1fr); gap: 12px; padding-right: 36px; }
      .recommendation-detail-photo,
      .recommendation-detail-media,
      .recommendation-detail-avatar { width: 72px; height: 64px; border-radius: 14px; }
      .recommendation-detail-photo .recommendation-detail-media { width: 100%; height: 100%; }
      .recommendation-detail-photo-zoom { display: none; }
      .dc-lightbox-overlay { padding: 12px; }
      .dc-lightbox-frame { height: min(640px, calc(100dvh - 24px)); }
      .dc-lightbox-close { top: 4px; right: 4px; }
      .dc-lightbox-prev { left: 4px; }
      .dc-lightbox-next { right: 4px; }
      .public-detail-actions { display: grid; grid-template-columns: 1fr; }
      .public-detail-actions .btn { width: 100%; }
      .side { grid-template-columns: 1fr; }
      .hero-actions .btn { width: 100%; }
      .footer-inner { flex-direction: column; }
      .footer-links { flex-wrap: wrap; }
      .public-toast { left: 14px; right: 14px; bottom: 14px; max-width: none; }
    }

    /* ─── V11: posicionamiento claro + lema responsive ─── */
    .tagline-strip {
      background:
        linear-gradient(90deg, rgba(238,246,252,.98), rgba(255,247,230,.96) 52%, rgba(236,253,243,.96));
      border-bottom: 1px solid rgba(199,219,236,.85);
      margin-bottom: 12px;
      box-shadow: inset 0 -1px 0 rgba(255,255,255,.72);
    }
    .tagline-strip .w {
      min-height: 54px;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      text-align: center;
      gap: 3px;
      padding-top: 8px;
      padding-bottom: 8px;
    }
    .tagline-main {
      color: var(--accent);
      font-family: var(--font-display);
      font-size: 15px;
      line-height: 1.15;
      font-style: normal;
      font-weight: 900;
      letter-spacing: -.018em;
    }
    .tagline-sub {
      color: var(--ink-2);
      font-family: var(--font-display);
      font-size: 13.5px;
      line-height: 1.25;
      font-style: italic;
      font-weight: 750;
      letter-spacing: -.012em;
    }
    @media (max-width: 680px) {
      .tagline-strip { margin-bottom: 8px; }
      .tagline-strip .w {
        min-height: 66px;
        gap: 3px;
        padding-top: 9px;
        padding-bottom: 9px;
      }
      .tagline-main {
        max-width: 340px;
        font-size: 12.8px;
        line-height: 1.18;
      }
      .tagline-sub {
        max-width: 340px;
        font-size: 11.3px;
        line-height: 1.24;
      }
    }
    @media (max-width: 360px) {
      .tagline-main { font-size: 12.2px; }
      .tagline-sub { font-size: 10.8px; }
    }

    @media (max-width: 680px) {
      .tagline-strip {
        font-size: 12.5px;
        margin-bottom: 9px;
      }
      .tagline-strip .w {
        min-height: 42px;
        justify-content: center;
        text-align: center;
        white-space: normal;
        line-height: 1.18;
        overflow: visible;
        padding-top: 8px;
        padding-bottom: 8px;
      }

      .module-nav {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        overflow: visible !important;
      }
      .module-tab {
        min-width: 0 !important;
        min-height: 52px !important;
        align-items: center !important;
        justify-content: center !important;
        text-align: center !important;
        padding: 9px 5px !important;
      }
      .module-tab strong {
        font-size: 12.4px !important;
        line-height: 1.05 !important;
      }
      .module-tab span {
        display: none !important;
      }

      .module-links {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        overflow: visible !important;
      }
      .module-link {
        min-width: 0 !important;
        min-height: 48px !important;
        text-align: center !important;
        align-items: center !important;
        justify-content: center !important;
        padding: 9px 4px !important;
        font-size: 11.2px !important;
        line-height: 1.05 !important;
      }
      .module-link span {
        display: none !important;
      }

      .module-wrap,
      .page {
        padding-top: 10px !important;
      }

      .hero-main {
        padding: 14px !important;
      }
      .hero h1 {
        font-size: 22px !important;
      }
      .hero p {
        font-size: 12.5px !important;
      }
      .hero-actions {
        display: none !important;
      }
      .hero-stats {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
      }
      .stat {
        padding: 8px 8px !important;
        border-right: 1px solid var(--line-soft) !important;
        border-bottom: 0 !important;
      }
      .stat strong {
        font-size: 14px !important;
      }
      .stat span {
        font-size: 9.8px !important;
      }

      .row-end {
        grid-column: 1 / -1;
        flex-direction: row;
        align-items: center;
        gap: 8px;
        margin-top: 2px;
        flex-wrap: wrap;
        background: #F8FBFF;
        border: 1px solid var(--line-soft);
        border-radius: 14px;
        padding: 8px;
      }
      .row-end .btn {
        flex: 1;
      }
      .row-end .btn-wa {
        min-width: 138px;
      }
    }

    @media (max-width: 380px) {
      .module-tab strong,
      .module-link {
        font-size: 10.7px !important;
      }
    }



    /* ─── V11 legibilidad + mobile para vecinos ─── */
    :root {
      --max: 1240px;
      --ink: #0E1B26;
      --ink-2: #243341;
      --ink-muted: #4C5D6D;
      --ink-light: #6F7F8F;
      --line: #D2DEE9;
      --line-soft: #E3EBF2;
      --accent: #063F67;
      --accent-2: #0872B6;
      --font-display: 'Manrope', 'Outfit', system-ui, sans-serif;
      --font-body: 'Manrope', 'Outfit', system-ui, sans-serif;
      --shadow: 0 2px 4px rgba(15,36,54,.045), 0 14px 34px rgba(15,36,54,.085);
    }

    html { scrollbar-gutter: stable; }
    body {
      font-size: 16px;
      line-height: 1.58;
      text-rendering: optimizeLegibility;
    }

    .w { padding-left: 22px; padding-right: 22px; }
    .topbar .w { min-height: 66px; }
    .logo-mark { width: 38px; height: 38px; border-radius: 13px; font-size: 13px; }
    .logo-text { font-size: 19px; font-weight: 800; letter-spacing: -.035em; }
    .search-wrap { max-width: 560px; }
    .search-wrap input {
      height: 44px;
      font-size: 15px;
      font-weight: 600;
      padding-left: 42px;
      border-color: #CEDCE8;
    }
    .search-wrap svg { width: 18px; height: 18px; left: 14px; color: var(--ink-muted); }

    .btn {
      min-height: 42px;
      padding: 0 18px;
      font-size: 14.5px;
      font-weight: 800;
    }
    .btn-sm {
      min-height: 36px;
      padding: 0 13px;
      font-size: 13.5px;
    }
    .zones .w { gap: 3px; }
    .zone-btn {
      padding: 12px 15px;
      font-size: 13.5px;
      font-weight: 750;
      color: var(--ink-muted);
    }

    .tagline-strip {
      font-size: 15.5px !important;
      margin-bottom: 14px;
      color: var(--ink-2);
      background:
        radial-gradient(circle at 15% 10%, rgba(8,114,182,.13), transparent 26%),
        linear-gradient(90deg, #EEF7FF 0%, #FFF8E7 50%, #ECFDF3 100%) !important;
    }
    .tagline-strip .w { min-height: 50px !important; }
    .tagline-brand { font-size: 16px; font-weight: 900; }
    .tagline-text { color: #1F2E3A !important; font-weight: 750 !important; }

    .module-strip { padding-top: 16px; }
    .module-links,
    .module-nav {
      border-color: #CFDDE8;
      border-radius: 20px;
    }
    .module-link,
    .module-tab {
      min-height: 70px;
      padding: 15px 14px;
      color: #435668;
    }
    .module-link {
      font-size: 14.4px;
      line-height: 1.14;
      font-weight: 850;
    }
    .module-link span,
    .module-tab span {
      font-size: 12.2px;
      line-height: 1.18;
      color: #607285;
      font-weight: 650;
      margin-top: 4px;
    }
    .module-tab strong {
      font-size: 16px;
      line-height: 1.1;
      font-weight: 850;
    }
    .module-link.on,
    .module-tab.on {
      background: linear-gradient(180deg, #EAF6FF, #FFFFFF);
      color: var(--accent);
      box-shadow: inset 0 -4px 0 var(--accent-2);
    }

    .page { padding-top: 20px; }
    .hero-main { padding: 26px 24px 22px; gap: 22px; }
    .crumb { font-size: 14px; margin-bottom: 10px; }
    .hero h1 {
      font-size: 38px;
      line-height: 1.02;
      letter-spacing: -.05em;
      font-weight: 850;
    }
    .hero p {
      font-size: 16px;
      line-height: 1.58;
      color: var(--ink-muted);
      margin-top: 8px;
      max-width: 760px;
    }
    .hero-stats { background: #F8FBFE; }
    .stat { padding: 14px 20px; }
    .stat strong { font-size: 22px; }
    .stat span { font-size: 13.5px; color: #516475; }

    .content-grid { grid-template-columns: minmax(0, 1fr) 320px; gap: 18px; margin-top: 18px; }
    .panel-head { padding: 18px 18px; }
    .panel-head h2 { font-size: 21px; font-weight: 850; }
    .panel-head p { font-size: 14.5px; color: var(--ink-muted); }
    .count { font-size: 13.5px; padding: 6px 11px; }
    .filters { padding: 14px 18px; grid-template-columns: minmax(240px,1fr) 200px 200px; gap: 10px; }
    .filter-input,
    .filter-select {
      height: 46px;
      font-size: 15px;
      color: var(--ink);
      border-color: #CDDCE8;
    }
    .item { padding: 18px; gap: 16px; }
    .item h3 { font-size: 19px; line-height: 1.2; }
    .item p { font-size: 15px; line-height: 1.5; color: var(--ink-muted); }
    .tag { min-height: 23px; padding: 4px 9px; font-size: 11.3px; }
    .code { font-size: 12.5px; padding: 6px 10px; }
    .side-pad { padding: 18px; }
    .side-box h3 { font-size: 18px; }
    .side-box p,
    .notice { font-size: 14px; line-height: 1.52; color: var(--ink-muted); }
    .side-row { font-size: 13.5px; }
    .side-row strong { font-size: 14px; }
    .empty-state { font-size: 15px; }
    .footer-brand { font-size: 16px; }
    .footer-legal,
    .footer-links a,
    .footer-link { font-size: 12.5px; color: #5F6F7E; }
    .modal-top h2 { font-size: 24px; }
    .modal-top p { font-size: 15px; }
    .modal-tab { font-size: 14.5px; }
    .modal-footer { font-size: 12.5px; }

    /* Home específico */
    .module-wrap { padding-top: 20px; }
    .module-tab { min-height: 72px; }
    .main-panel,
    .hero-card,
    .popular-card,
    .mini-card,
    .notice-card,
    .list-card,
    .feed-card,
    .quick-card {
      border-color: #D2DEE9;
    }
    .panel-title,
    .hero-card h1,
    .hero-title,
    .section-title {
      letter-spacing: -.04em;
    }

    @media (max-width: 920px) {
      .content-grid { grid-template-columns: 1fr; }
      .side { grid-template-columns: 1fr 1fr; }
      .filters { grid-template-columns: 1fr 1fr; }
      .filters .filter-input { grid-column: 1 / -1; }
      .hero-main { grid-template-columns: 1fr; }
      .hero-actions { justify-content: flex-start; }
    }

    @media (max-width: 760px) {
      body { font-size: 15.5px; line-height: 1.56; }
      .w { padding-left: 12px; padding-right: 12px; }
      .topbar .w {
        min-height: auto;
        gap: 10px;
        padding-top: 10px;
        padding-bottom: 10px;
        flex-wrap: wrap;
      }
      .logo-mark { width: 36px; height: 36px; border-radius: 12px; }
      .logo-text { font-size: 18px !important; }
      .top-actions { margin-left: auto; }
      .top-actions .hide-m { display: none !important; }
      .btn { min-height: 42px; font-size: 14.5px; padding: 0 16px; }
      .btn-sm { min-height: 38px; font-size: 14px; padding: 0 13px; }
      .search-wrap { order: 3; flex: 1 0 100%; max-width: none; margin: 0; }
      .search-wrap input,
      .filter-input,
      .filter-select,
      input,
      select,
      textarea {
        font-size: 16px;
      }
      .zones .w { padding-left: 12px; padding-right: 12px; }
      .zone-btn { font-size: 13.5px; padding: 11px 13px; }
      .tagline-strip { font-size: 14px !important; margin-bottom: 10px; }
      .tagline-strip .w { min-height: 46px !important; line-height: 1.25 !important; padding-top: 9px; padding-bottom: 9px; }
      .tagline-brand { font-size: 14.5px; }

      .module-strip { padding-top: 10px; }
      .module-links,
      .module-nav {
        display: grid !important;
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        overflow: visible !important;
        border-radius: 16px !important;
      }
      .module-link,
      .module-tab {
        min-width: 0 !important;
        min-height: 58px !important;
        padding: 10px 5px !important;
        align-items: center !important;
        justify-content: center !important;
        text-align: center !important;
        font-size: 12.8px !important;
        line-height: 1.08 !important;
        border-bottom: 1px solid var(--line-soft);
      }
      .module-tab strong {
        font-size: 12.9px !important;
        line-height: 1.08 !important;
      }
      .module-link span,
      .module-tab span { display: none !important; }

      .page,
      .module-wrap { padding-top: 12px !important; }
      .hero-main { padding: 18px !important; }
      .hero h1 { font-size: 30px !important; }
      .hero p { font-size: 15.5px !important; line-height: 1.55 !important; }
      .hero-actions { display: none !important; }
      .hero-stats { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
      .stat { padding: 11px 9px !important; border-right: 1px solid var(--line-soft) !important; border-bottom: 0 !important; }
      .stat strong { font-size: 18px !important; }
      .stat span { font-size: 11.8px !important; line-height: 1.2; }

      .content-grid { gap: 14px; margin-top: 14px; }
      .panel-head { padding: 16px 14px; align-items: flex-start; }
      .panel-head h2 { font-size: 20px; }
      .panel-head p { font-size: 14px; }
      .count { font-size: 12.5px; }
      .filters { grid-template-columns: 1fr !important; padding: 12px 14px; gap: 9px; }
      .item { grid-template-columns: 54px 1fr; gap: 12px; padding: 15px 14px; }
      .badge { width: 54px !important; height: 48px !important; border-radius: 14px; }
      .badge.avatar { width: 46px !important; height: 46px !important; }
      .card-thumb { width: 54px !important; height: 48px !important; border-radius: 14px; }
      .item h3 { font-size: 17px; line-height: 1.22; }
      .item p { font-size: 14.5px; line-height: 1.48; }
      .tag { font-size: 10.8px; min-height: 22px; }
      .actions,
      .row-end {
        grid-column: 1 / -1;
        flex-direction: row;
        align-items: center;
        justify-content: flex-start;
        min-width: 0;
        flex-wrap: wrap;
        gap: 8px;
        margin-top: 3px;
      }
      .actions .btn,
      .row-end .btn { flex: 1; min-width: 128px; }
      .code { font-size: 12px; }
      .side { grid-template-columns: 1fr !important; }
      .side-pad { padding: 16px; }
      .side-box h3 { font-size: 18px; }
      .side-box p,
      .notice { font-size: 14.5px; }
      .footer-inner { flex-direction: column; }
      .modal { max-width: 94vw; }
      .modal-top { padding: 22px 20px 0; }
      .modal-body { padding: 20px; }
    }

    @media (max-width: 380px) {
      .module-link,
      .module-tab strong { font-size: 12px !important; }
      .btn { font-size: 14px; padding: 0 13px; }
      .hero h1 { font-size: 28px !important; }
      .hero p { font-size: 15px !important; }
    }

    /* Distrito Countries public design system */
    :root {
      --dc-navy: #063047;
      --dc-petrol: #0B4A45;
      --dc-forest: #2F6B57;
      --dc-sage: #6F9B7A;
      --dc-sand: #F6F1E8;
      --dc-warm-white: #FAFBF8;
      --dc-gold: #C8A95A;
      --dc-terracotta: #C96A4A;
      --dc-text: #102A38;
    }

    body:not(.account-page) {
      --bg: var(--dc-sand);
      --card: var(--dc-warm-white);
      --card-hover: #F5F8F1;
      --ink: var(--dc-text);
      --ink-2: #243C3D;
      --ink-muted: #5E6D67;
      --ink-light: #7D8D86;
      --line: #DCE7E2;
      --line-soft: #EAF1EC;
      --accent: var(--dc-navy);
      --accent-2: var(--dc-forest);
      --accent-bg: #EEF6EF;
      --accent-line: #BFD4C8;
      --gold: #A98D3F;
      --gold-bg: #FBF4DF;
      --gold-line: rgba(200,169,90,.36);
      --green: var(--dc-sage);
      --green-dk: var(--dc-forest);
      --green-bg: #EEF6EF;
      --red: #A94F3B;
      --red-bg: #FCF0EA;
      background:
        radial-gradient(circle at 12% -10%, rgba(111,155,122,.16), transparent 32%),
        linear-gradient(180deg, var(--dc-warm-white) 0%, var(--dc-sand) 330px);
    }

    body:not(.account-page) .topbar {
      background: rgba(250,251,248,.92);
      border-bottom-color: rgba(220,231,226,.9);
    }

    body:not(.account-page) .logo-mark,
    body:not(.account-page) .publish-box {
      background: linear-gradient(135deg, var(--dc-navy), var(--dc-forest));
      box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 8px 18px rgba(47,107,87,.16);
    }

    body:not(.account-page) .btn-accent {
      background: var(--dc-forest);
      border-color: var(--dc-forest);
      box-shadow: 0 10px 20px rgba(47,107,87,.16);
    }

    body:not(.account-page) .btn-accent:hover {
      background: var(--dc-petrol);
      border-color: var(--dc-petrol);
    }

    body:not(.account-page) .tagline-strip {
      background:
        radial-gradient(circle at 14% 0%, rgba(200,169,90,.15), transparent 30%),
        linear-gradient(90deg, rgba(238,246,239,.98), rgba(250,251,248,.96) 48%, rgba(246,241,232,.98)) !important;
      border-bottom-color: rgba(220,231,226,.9);
    }

    body:not(.account-page) .module-links,
    body:not(.account-page) .module-nav {
      grid-template-columns: repeat(8, minmax(0, 1fr));
      background: rgba(250,251,248,.94);
      border-color: rgba(220,231,226,.98);
      box-shadow: 0 1px 2px rgba(16,42,56,.04), 0 14px 34px rgba(16,42,56,.07);
    }

    body:not(.account-page) .module-link,
    body:not(.account-page) .module-tab {
      border-color: rgba(220,231,226,.86);
      transition: transform .14s ease, background .14s ease, color .14s ease, box-shadow .14s ease;
    }

    body:not(.account-page) .module-link:hover,
    body:not(.account-page) .module-tab:hover {
      transform: translateY(-1px);
      background: #EEF6EF;
      color: var(--dc-forest);
    }

    body:not(.account-page) .module-link.on,
    body:not(.account-page) .module-tab.on {
      background: linear-gradient(180deg, #EEF6EF, var(--dc-warm-white));
      color: var(--dc-forest);
      box-shadow: inset 0 -4px 0 var(--dc-forest);
    }

    body:not(.account-page) .hero,
    body:not(.account-page) .public-module-hero,
    body:not(.account-page) .panel,
    body:not(.account-page) .main-panel,
    body:not(.account-page) .side-box {
      background: var(--dc-warm-white);
      border-color: rgba(220,231,226,.96);
      box-shadow: 0 1px 2px rgba(16,42,56,.04), 0 16px 36px rgba(16,42,56,.075);
    }

    body:not(.account-page) .hero-main,
    body:not(.account-page) .panel-head {
      background:
        radial-gradient(circle at 100% 0%, rgba(200,169,90,.12), transparent 30%),
        linear-gradient(180deg, var(--dc-warm-white), #F7FAF3);
    }

    body:not(.account-page) .item,
    body:not(.account-page) .row-item,
    body:not(.account-page) .compact-row,
    body:not(.account-page) .side-box {
      transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease, background .16s ease;
    }

    body:not(.account-page) .item:hover,
    body:not(.account-page) .row-item:hover,
    body:not(.account-page) .compact-row:hover,
    body:not(.account-page) .side-box:hover {
      transform: translateY(-2px);
      background: #FAFBF8;
      box-shadow: 0 14px 34px rgba(16,42,56,.08);
    }

    body:not(.account-page) .badge.promo,
    body:not(.account-page) .row-badge.promo {
      background: #FCF0EA;
      color: var(--dc-terracotta);
      border-color: rgba(201,106,74,.24);
    }

    body:not(.account-page) .badge.gold,
    body:not(.account-page) .t-gold,
    body:not(.account-page) .code,
    body:not(.account-page) .code-pill {
      background: var(--gold-bg);
      color: #8E7130;
      border-color: var(--gold-line);
    }

    @media (max-width: 760px) {
      body:not(.account-page) .module-links,
      body:not(.account-page) .module-nav {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
      }
    }

    @media (max-width: 430px) {
      body:not(.account-page) .module-links,
      body:not(.account-page) .module-nav {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
      }
    }

    @media (prefers-reduced-motion: reduce) {
      body:not(.account-page) .btn,
      body:not(.account-page) .item,
      body:not(.account-page) .row-item,
      body:not(.account-page) .compact-row,
      body:not(.account-page) .side-box,
      body:not(.account-page) .module-link,
      body:not(.account-page) .module-tab {
        transition: none !important;
      }

      body:not(.account-page) .btn:hover,
      body:not(.account-page) .item:hover,
      body:not(.account-page) .row-item:hover,
      body:not(.account-page) .compact-row:hover,
      body:not(.account-page) .side-box:hover,
      body:not(.account-page) .module-link:hover,
      body:not(.account-page) .module-tab:hover {
        transform: none !important;
      }
    }
    /* Chicos y familia: vertical curada sobre datos públicos existentes */
    .kids-family-page {
      --bg: #F6F1E8;
      --card: #FAFBF8;
      --card-hover: #F7FAF3;
      --ink: #102A38;
      --ink-2: #243C3D;
      --ink-muted: #5E6D67;
      --ink-light: #80918A;
      --line: #DCE7E2;
      --line-soft: #EAF1EC;
      --accent: #063047;
      --accent-2: #2F6B57;
      --accent-bg: #EEF5EF;
      --accent-line: #BFD4C8;
      --gold: #A98D3F;
      --gold-bg: #FBF4DF;
      --gold-line: rgba(200,169,90,.35);
      --green: #6F9B7A;
      --green-dk: #2F6B57;
      --green-bg: #EEF6EF;
      background: linear-gradient(180deg, #FAFBF8 0%, #F6F1E8 320px);
    }

    .kids-family-page .logo-mark {
      background: linear-gradient(135deg, #063047, #2F6B57);
      box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 8px 18px rgba(47,107,87,.18);
    }

    .kids-family-page .topbar {
      background: rgba(250,251,248,.92);
      border-bottom-color: rgba(220,231,226,.9);
    }

    .kids-family-page .module-link.on {
      background: linear-gradient(180deg, #EEF6EF, #FAFBF8);
      color: #2F6B57;
      box-shadow: inset 0 -4px 0 #2F6B57;
    }

    .kids-family-page .hero {
      border-color: rgba(220,231,226,.92);
      background: linear-gradient(180deg, #FAFBF8, #F7FAF3);
      color: var(--ink);
      position: relative;
    }

    .kids-family-page .hero::after {
      content: none;
    }

    .kids-family-page .hero-main,
    .kids-family-page .hero-stats {
      position: relative;
      z-index: 1;
    }

    .kids-family-page .hero h1 {
      color: var(--ink);
    }

    .kids-family-page .crumb {
      color: var(--accent);
    }

    .kids-family-page .hero p {
      color: var(--ink-muted);
    }

    .kids-family-page .crumb {
      opacity: .9;
    }

    .kids-family-page .hero-stats {
      border-top-color: var(--line-soft);
      background: #F8FBF4;
    }

    .kids-family-page .stat {
      border-color: var(--line-soft);
    }

    .kids-family-page .stat strong {
      color: var(--accent);
    }

    .kids-family-page .stat span {
      color: var(--ink-muted);
      opacity: 1;
    }

    .kids-controls {
      margin-top: 16px;
    }

    .kids-controls .panel-head {
      background:
        radial-gradient(circle at 98% 0%, rgba(200,169,90,.12), transparent 34%),
        linear-gradient(180deg, #FAFBF8, #F6F9F4);
    }

    .kids-filter-bar {
      display: flex;
      gap: 8px;
      padding: 14px 18px 2px;
      overflow-x: auto;
      scrollbar-width: thin;
    }

    .kids-filter-chip {
      flex: 0 0 auto;
      min-height: 38px;
      border: 1px solid var(--line);
      border-radius: 999px;
      padding: 0 14px;
      background: #fff;
      color: var(--ink-muted);
      font-size: 13px;
      font-weight: 850;
      transition: transform .14s ease, border-color .14s ease, background .14s ease, color .14s ease, box-shadow .14s ease;
    }

    .kids-filter-chip:hover {
      transform: translateY(-1px);
      border-color: var(--accent-line);
      background: var(--accent-bg);
      color: var(--accent-2);
      box-shadow: 0 8px 18px rgba(47,107,87,.08);
    }

    .kids-filter-chip.on {
      border-color: #2F6B57;
      background: #2F6B57;
      color: #fff;
      box-shadow: 0 10px 22px rgba(47,107,87,.18);
    }

    .kids-filter-row {
      grid-template-columns: minmax(240px, 1fr) 220px;
      border-bottom: 0;
      background: transparent;
    }

    .kids-layout {
      grid-template-columns: minmax(0, 1fr) 315px;
    }

    .kids-main-panel,
    .kids-secondary-panel,
    .kids-side .side-box {
      border-color: rgba(220,231,226,.95);
      background: #FAFBF8;
    }

    .kids-main-panel .panel-head,
    .kids-secondary-panel .panel-head {
      background: linear-gradient(180deg, #FAFBF8, #F7FAF3);
    }

    .kids-list {
      display: grid;
      gap: 12px;
      padding: 14px;
    }

    .kids-card {
      display: grid;
      grid-template-columns: 58px minmax(0, 1fr) auto;
      gap: 14px;
      align-items: start;
      padding: 16px;
      border: 1px solid rgba(220,231,226,.95);
      border-radius: 18px;
      background: #fff;
      box-shadow: 0 1px 2px rgba(16,42,56,.04);
      transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease, background .16s ease;
    }

    .kids-card:hover {
      transform: translateY(-2px);
      border-color: rgba(111,155,122,.58);
      background: #FAFBF8;
      box-shadow: 0 14px 34px rgba(16,42,56,.08);
    }

    .kids-card-mark {
      width: 58px;
      height: 58px;
      border-radius: 18px;
      display: grid;
      place-items: center;
      background: linear-gradient(135deg, rgba(47,107,87,.12), rgba(200,169,90,.14));
      border: 1px solid rgba(111,155,122,.24);
      color: #2F6B57;
      font-weight: 900;
      letter-spacing: -.04em;
    }

    .kids-card-kicker {
      color: #2F6B57;
      font-size: 11.5px;
      font-weight: 900;
      letter-spacing: .06em;
      text-transform: uppercase;
      margin-bottom: 2px;
    }

    .kids-card h3 {
      display: flex;
      align-items: center;
      gap: 6px;
      flex-wrap: wrap;
      font-family: var(--font-display);
      font-size: 18px;
      line-height: 1.2;
      letter-spacing: -.03em;
      color: var(--ink);
    }

    .kids-card p {
      margin-top: 5px;
      color: var(--ink-muted);
      font-size: 14px;
      line-height: 1.48;
    }

    .kids-card-actions {
      display: flex;
      flex-direction: row;
      flex-wrap: wrap;
      align-items: flex-end;
      justify-content: flex-end;
      gap: 7px;
      min-width: 218px;
    }
    .kids-card-actions .recommendation-widget { justify-items: end; }

    .kids-card-compact {
      grid-template-columns: 50px minmax(0, 1fr) auto;
      padding: 14px;
    }

    .kids-card-compact .kids-card-mark {
      width: 50px;
      height: 50px;
      border-radius: 15px;
    }

    .kids-related-list {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .kids-secondary-panel {
      margin-top: 16px;
    }

    .kids-secondary-panel[hidden] {
      display: none;
    }

    .kids-side .publish-box {
      background: linear-gradient(135deg, #063047, #2F6B57);
    }

    .kids-side .notice {
      display: none;
      background: #EEF6EF;
      border-color: rgba(111,155,122,.32);
      color: #385D50;
    }

    .kids-side .notice.show {
      display: block;
    }

    @media (prefers-reduced-motion: reduce) {
      .kids-card,
      .kids-filter-chip {
        transition: none;
      }

      .kids-card:hover,
      .kids-filter-chip:hover {
        transform: none;
      }
    }

    @media (max-width: 920px) {
      .kids-layout,
      .kids-related-list {
        grid-template-columns: 1fr;
      }
    }

    @media (max-width: 760px) {
      .kids-controls {
        margin-top: 12px;
      }

      .kids-filter-bar {
        padding: 12px 14px 0;
        gap: 7px;
      }

      .kids-filter-chip {
        min-height: 40px;
        font-size: 12.5px;
        padding: 0 12px;
      }

      .kids-card,
      .kids-card-compact {
        grid-template-columns: 52px minmax(0, 1fr);
        padding: 14px;
        gap: 11px;
      }

      .kids-card-mark,
      .kids-card-compact .kids-card-mark {
        width: 52px;
        height: 52px;
        border-radius: 16px;
      }

      .kids-card h3 {
        font-size: 16.5px;
      }

      .kids-card p {
        font-size: 14px;
      }

      .kids-card-actions {
        grid-column: 1 / -1;
        flex-direction: row;
        align-items: center;
        justify-content: flex-start;
        min-width: 0;
        flex-wrap: wrap;
      }

      .kids-card-actions .btn {
        flex: 1;
        min-width: 136px;
      }

      .kids-family-page .hero-stats {
        grid-template-columns: 1fr !important;
      }

      .kids-family-page .stat {
        border-right: 0 !important;
        border-bottom: 1px solid var(--line-soft) !important;
      }

      .kids-family-page .stat:last-child {
        border-bottom: 0 !important;
      }
    }



    /* Franja pública de comunidad compartida */
    .public-community-strip,
    .tagline-strip {
      margin-bottom: 12px !important;
      background:
        linear-gradient(90deg, rgba(238,246,239,.98) 0%, rgba(250,251,248,.98) 48%, rgba(246,241,232,.98) 100%) !important;
      border-bottom: 1px solid rgba(220,231,226,.9) !important;
      box-shadow: inset 0 -1px 0 rgba(255,255,255,.72) !important;
    }
    .public-community-strip .w.tagline-inner,
    .tagline-strip .w.tagline-inner {
      min-height: 58px !important;
      display: flex !important;
      flex-direction: column !important;
      align-items: center !important;
      justify-content: center !important;
      text-align: center !important;
      gap: 3px !important;
      padding-top: 9px !important;
      padding-bottom: 9px !important;
      line-height: 1.2 !important;
    }
    .tagline-main {
      color: var(--accent) !important;
      font-family: var(--font-display) !important;
      font-size: 15.5px !important;
      line-height: 1.16 !important;
      font-style: normal !important;
      font-weight: 900 !important;
      letter-spacing: -.018em !important;
      text-wrap: balance;
    }
    .tagline-sub {
      color: #1F2E3A !important;
      font-family: var(--font-display) !important;
      font-size: 13.6px !important;
      line-height: 1.25 !important;
      font-style: italic !important;
      font-weight: 750 !important;
      letter-spacing: -.012em !important;
      text-wrap: balance;
    }
    @media (max-width: 680px) {
      .public-community-strip,
      .tagline-strip { margin-bottom: 8px !important; }
      .public-community-strip .w.tagline-inner,
      .tagline-strip .w.tagline-inner {
        min-height: 72px !important;
        padding-top: 9px !important;
        padding-bottom: 9px !important;
        gap: 4px !important;
      }
      .tagline-main {
        max-width: 350px !important;
        font-size: 13.2px !important;
        line-height: 1.18 !important;
      }
      .tagline-sub {
        max-width: 350px !important;
        font-size: 11.5px !important;
        line-height: 1.24 !important;
      }
    }
    @media (max-width: 360px) {
      .public-community-strip .w.tagline-inner,
      .tagline-strip .w.tagline-inner { min-height: 76px !important; }
      .tagline-main { font-size: 12.4px !important; }
      .tagline-sub { font-size: 10.8px !important; }
    }

    /* ─── DC Premium Account Portal ─── */
    .account-page {
      --dc-navy: #063047;
      --dc-navy-light: #0B4A45;
      --dc-petrol: #0B4A45;
      --dc-blue: #0B4A45;
      --dc-forest: #2F6B57;
      --dc-sage: #6F9B7A;
      --dc-sage-soft: #EAF2EA;
      --dc-sand: #F6F1E8;
      --dc-warm: #FAFBF8;
      --dc-gold: #C8A95A;
      --dc-gold-soft: #FBF4DC;
      --dc-terracotta: #C96A4A;
      --dc-terracotta-soft: #FBEDE6;
      --dc-sky: #EDF5F1;
      --dc-sky-deep: #D7E8DD;
      --dc-bg: #F6F1E8;
      --dc-surface: #FAFBF8;
      --dc-surface-alt: #F3F7F1;
      --dc-border: #DCE7E2;
      --dc-border-soft: #E7EEE9;
      --dc-text: #102A38;
      --dc-text-2: #244150;
      --dc-muted: #5F716D;
      --dc-success: #2F6B57;
      --dc-success-bg: #EAF2EA;
      --dc-warning: #8A6A18;
      --dc-warning-bg: #FBF4DC;
      --dc-danger: #B94A48;
      --dc-danger-bg: #FEF2F2;
      --dc-radius: 10px;
      --dc-radius-lg: 14px;
      --dc-shadow-sm: 0 1px 2px rgba(16,42,56,.04);
      --dc-shadow: 0 1px 2px rgba(16,42,56,.04);
      --dc-shadow-lg: 0 1px 2px rgba(16,42,56,.05);

      background: var(--dc-bg);
      color: var(--dc-text);
    }
    .account-page .topbar {
      background: rgba(250,251,248,.94);
      backdrop-filter: blur(20px);
      -webkit-backdrop-filter: blur(20px);
      border-bottom: 1px solid var(--dc-border);
      box-shadow: 0 1px 0 rgba(16,42,56,.04), 0 8px 22px rgba(16,42,56,.045);
    }
    .account-page .topbar .w {
      min-height: 54px;
      gap: 10px;
    }
    .account-back-link {
      display: inline-flex;
      width: 32px;
      height: 32px;
      align-items: center;
      justify-content: center;
      flex: 0 0 auto;
      border: 1px solid rgba(220,231,226,.82);
      border-radius: 999px;
      color: var(--dc-petrol);
      background: rgba(250,251,248,.72);
      font-size: 17px;
      font-weight: 800;
      box-shadow: 0 1px 2px rgba(16,42,56,.035);
      transition: transform .14s ease, border-color .14s ease, background .14s ease, box-shadow .14s ease;
    }
    .account-back-link:hover {
      transform: translateY(-1px);
      border-color: rgba(47,107,87,.34);
      background: var(--dc-sage-soft);
      box-shadow: 0 8px 18px rgba(16,42,56,.07);
    }
    .account-page .logo-mark {
      width: 32px;
      height: 32px;
      border-radius: 9px;
      background: linear-gradient(135deg, var(--dc-navy) 0%, var(--dc-petrol) 48%, var(--dc-forest) 100%);
      box-shadow: 0 8px 18px rgba(11,74,69,.18);
    }
    .account-page .logo-text {
      font-size: 16px;
      letter-spacing: -.02em;
    }
    .account-shell {
      padding-top: 18px;
      padding-bottom: 48px;
    }
    .account-hero {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 14px;
      align-items: center;
      padding: 17px 22px;
      background:
        radial-gradient(circle at 92% 0%, rgba(200,169,90,.20), transparent 34%),
        radial-gradient(circle at 12% 100%, rgba(111,155,122,.22), transparent 36%),
        linear-gradient(135deg, var(--dc-navy) 0%, var(--dc-petrol) 47%, var(--dc-forest) 100%);
      border: none;
      border-radius: var(--dc-radius-lg);
      box-shadow: var(--dc-shadow-lg);
    }
    .account-hero .crumb {
      color: rgba(255,255,255,.6);
      font-size: 12px;
    }
    .account-hero .crumb:hover {
      color: rgba(255,255,255,.85);
    }
    .account-hero h1 {
      font-family: var(--font-display);
      font-size: 23px;
      line-height: 1.15;
      font-weight: 800;
      letter-spacing: -.02em;
      color: #fff;
    }
    .account-hero p {
      max-width: 680px;
      margin-top: 4px;
      color: rgba(255,255,255,.7);
      font-size: 13.5px;
      font-weight: 500;
    }
    .account-hero-side {
      display: flex;
      align-items: center;
      justify-content: flex-end;
    }
    .account-pill,
    .account-data-badge,
    .account-status {
      display: inline-flex;
      align-items: center;
      min-height: 26px;
      padding: 3px 10px;
      border-radius: 999px;
      font-size: 10.5px;
      font-weight: 700;
      border: 1px solid var(--dc-border);
      color: var(--dc-muted);
      background: var(--dc-surface);
      white-space: nowrap;
      letter-spacing: .02em;
    }
    .account-pill {
      min-height: 22px;
      padding: 2px 8px;
      color: var(--dc-muted);
      background: rgba(246,241,232,.52);
      border-color: var(--dc-border-soft);
      font-size: 9.5px;
    }
    .account-pill[data-status="ready"],
    .account-data-badge[data-mode="real"] {
      color: var(--green-dk);
      background: var(--green-bg);
      border-color: rgba(13,95,45,.16);
    }
    .account-data-badge[data-mode="demo"] {
      color: var(--gold);
      background: var(--gold-bg);
      border-color: var(--gold-line);
    }
    .account-page .top-actions {
      gap: 6px;
      align-items: center;
      margin-left: auto;
    }
    .account-page .top-actions .btn {
      min-height: 31px;
      padding: 4px 11px;
      font-size: 12px;
      font-weight: 600;
      border-radius: 8px;
    }
    .account-page .top-actions .btn-ghost {
      background: transparent;
      border-color: rgba(220,231,226,.82);
      color: var(--dc-text-2);
    }
    .account-page .top-actions .btn-ghost:hover {
      color: var(--dc-danger);
      border-color: rgba(220,38,38,.25);
      background: var(--dc-danger-bg);
    }
    .account-page .top-actions .btn-soft {
      background: transparent;
      border-color: transparent;
      color: var(--dc-muted);
    }
    .account-page .top-actions .btn-soft:hover {
      background: var(--dc-sand);
      color: var(--dc-petrol);
    }
    .account-page .btn-accent,
    .account-page .btn-primary {
      color: #fff;
      background: linear-gradient(135deg, #285D4B, var(--dc-forest));
      border-color: rgba(47,107,87,.5);
      box-shadow: 0 10px 20px rgba(47,107,87,.18);
    }
    .account-page .btn {
      transition: transform .14s ease, border-color .14s ease, background .14s ease, box-shadow .14s ease, color .14s ease;
    }
    .account-page .btn-accent:hover,
    .account-page .btn-primary:hover {
      background: linear-gradient(135deg, #214E40, #285D4B);
      box-shadow: 0 12px 24px rgba(47,107,87,.22);
    }
    .account-page .btn-soft {
      background: var(--dc-sage-soft);
      border-color: var(--dc-sky-deep);
      color: var(--dc-forest);
    }
    .account-page .btn-soft:hover {
      background: #DDECDD;
      border-color: rgba(111,155,122,.45);
      color: var(--dc-navy);
    }
    .account-auth-panel,
    .account-demo-switch,
    .account-state,
    .account-toolbar,
    .account-card,
    .account-metric {
      background: var(--dc-surface);
      border: 1px solid var(--dc-border);
      border-radius: var(--dc-radius);
      box-shadow: var(--dc-shadow);
    }
    .account-auth-panel {
      margin-top: 18px;
      padding: 28px 32px;
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(280px, 420px);
      gap: 24px;
      align-items: center;
      border-left: 4px solid var(--dc-navy);
    }
    .account-auth-actions {
      display: flex;
      gap: 10px;
      justify-content: flex-end;
      flex-wrap: wrap;
    }
    .account-auth-actions .btn {
      min-width: 132px;
    }
    .account-demo-switch {
      margin-top: 14px;
      padding: 14px 16px;
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 12px;
      align-items: center;
      background: #FFFCF1;
      border-color: var(--gold-line);
    }
    .account-demo-switch[hidden] {
      display: none;
    }
    .account-auth-panel[hidden],
    .account-state[hidden],
    .account-app[hidden],
    .account-context-card[hidden],
    .account-owner-section[hidden],
    .account-resident-section[hidden],
    .account-select[hidden] {
      display: none !important;
    }
    .account-demo-switch strong {
      display: block;
      color: var(--ink);
      font-size: 13px;
      line-height: 1.35;
    }
    .account-demo-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      justify-content: flex-end;
    }
    .account-demo-actions .btn.is-active {
      color: #fff;
      background: var(--accent);
      border-color: var(--accent);
    }
    .eyebrow {
      margin-bottom: 4px;
      color: var(--dc-forest);
      font-size: 10.5px;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: .08em;
    }
    .account-auth-panel h2,
    .account-toolbar h2,
    .account-card h2 {
      font-family: var(--font-display);
      font-size: 18px;
      font-weight: 800;
      letter-spacing: -.01em;
      color: var(--dc-navy);
    }
    .account-auth-panel p {
      color: var(--dc-muted);
      font-size: 13.5px;
      line-height: 1.5;
    }
    .account-auth-form,
    .account-form {
      display: grid;
      gap: 12px;
    }
    .account-advanced-auth {
      border: 1px solid var(--dc-border);
      border-radius: var(--dc-radius);
      background: var(--dc-surface-alt);
      padding: 10px 12px;
    }
    .account-advanced-auth summary {
      color: var(--dc-muted);
      cursor: pointer;
      font-size: 12px;
      font-weight: 700;
    }
    .account-advanced-auth[open] {
      display: grid;
      gap: 10px;
    }
    .account-advanced-auth[open] summary {
      margin-bottom: 2px;
      color: var(--dc-forest);
    }
    .account-auth-form label,
    .account-form label,
    .account-zones-field,
    .account-fieldset {
      display: grid;
      gap: 6px;
      color: var(--dc-text-2);
      font-size: 12.5px;
      font-weight: 700;
    }
    .account-fieldset {
      grid-template-columns: repeat(2, minmax(0, 1fr));
      border: 1px solid var(--dc-border);
      border-radius: var(--dc-radius);
      padding: 14px;
      margin: 0;
    }
    .account-fieldset legend {
      padding: 0 6px;
      color: var(--dc-navy);
      font-size: 13px;
      font-weight: 700;
    }
    .account-auth-form input,
    .account-form input,
    .account-form select,
    .account-form textarea,
    .account-select {
      width: 100%;
      min-height: 42px;
      border: 1px solid var(--dc-border);
      border-radius: 8px;
      background: var(--dc-surface);
      color: var(--dc-text);
      padding: 10px 12px;
      font-size: 13.5px;
      outline: none;
      transition: border-color .15s ease, box-shadow .15s ease;
    }
    .account-form textarea {
      resize: vertical;
      min-height: 110px;
      line-height: 1.45;
    }
    .account-auth-form input:focus,
    .account-form input:focus,
    .account-form select:focus,
    .account-form textarea:focus,
    .account-select:focus {
      border-color: var(--dc-sage);
      box-shadow: 0 0 0 3px rgba(111,155,122,.18);
    }
    .account-form-actions {
      display: flex;
      gap: 8px;
      flex-wrap: wrap;
      justify-content: flex-end;
    }
    .account-state {
      margin-top: 18px;
      padding: 24px;
      color: var(--dc-muted);
      font-size: 14px;
      font-weight: 600;
      text-align: center;
      border-radius: var(--dc-radius);
    }
    .account-state-error {
      color: var(--dc-danger);
      background: var(--dc-danger-bg);
      border-color: rgba(220,38,38,.16);
    }
    .account-app {
      margin-top: 18px;
      display: grid;
      grid-template-columns: minmax(210px, 256px) minmax(0, 1fr);
      gap: 20px;
      align-items: start;
    }
    .account-sidebar {
      position: sticky;
      top: 82px;
      display: grid;
      gap: 12px;
      min-width: 0;
    }
    .account-sidebar-card {
      padding: 20px 18px;
      background:
        radial-gradient(circle at top right, rgba(200,169,90,.22), transparent 34%),
        radial-gradient(circle at bottom left, rgba(111,155,122,.20), transparent 38%),
        linear-gradient(135deg, var(--dc-navy) 0%, var(--dc-petrol) 58%, var(--dc-forest) 100%);
      border: none;
      border-radius: var(--dc-radius);
      box-shadow: var(--dc-shadow-lg);
    }
    .account-sidebar-kicker {
      display: block;
      color: rgba(255,255,255,.55);
      font-size: 10px;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: .08em;
    }
    .account-nav-group {
      display: block;
      color: var(--dc-muted);
      font-size: 10px;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: .08em;
    }
    .account-sidebar-card strong {
      display: block;
      margin-top: 6px;
      color: #fff;
      font-family: var(--font-display);
      font-size: 17px;
      font-weight: 800;
      line-height: 1.2;
    }
    .account-sidebar-card p {
      margin-top: 6px;
      color: rgba(255,255,255,.6);
      font-size: 12px;
      line-height: 1.4;
      font-weight: 600;
    }
    .account-section-nav {
      display: grid;
      gap: 8px;
      padding: 11px;
      background:
        linear-gradient(180deg, rgba(250,251,248,.98) 0%, rgba(239,246,238,.98) 100%);
      border: 1px solid rgba(111,155,122,.22);
      border-radius: var(--dc-radius);
      box-shadow: var(--dc-shadow);
    }
    .account-mobile-section-control {
      display: none;
      padding: 13px;
      background: linear-gradient(180deg, rgba(250,251,248,.98), var(--dc-surface-alt));
      border: 1px solid rgba(111,155,122,.28);
      border-radius: var(--dc-radius);
      box-shadow: 0 1px 2px rgba(16,42,56,.04), 0 12px 26px rgba(16,42,56,.07);
    }
    .account-mobile-section-control label {
      display: grid;
      gap: 7px;
      color: var(--dc-text-2);
      font-size: 11px;
      font-weight: 800;
      text-transform: uppercase;
      letter-spacing: .05em;
    }
    .account-nav-group {
      padding: 10px 10px 2px;
      color: rgba(36,65,80,.68);
    }
    .account-nav-icon {
      display: inline-flex;
      width: 17px;
      height: 17px;
      flex-shrink: 0;
      margin-right: 9px;
      background: currentColor;
      opacity: .82;
      transition: opacity .12s ease;
    }
    .account-nav-icon[data-icon="grid"] { -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='currentColor' stroke-width='2'%3E%3Crect x='3' y='3' width='7' height='7' rx='1'/%3E%3Crect x='14' y='3' width='7' height='7' rx='1'/%3E%3Crect x='3' y='14' width='7' height='7' rx='1'/%3E%3Crect x='14' y='14' width='7' height='7' rx='1'/%3E%3C/svg%3E") center/contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='currentColor' stroke-width='2'%3E%3Crect x='3' y='3' width='7' height='7' rx='1'/%3E%3Crect x='14' y='3' width='7' height='7' rx='1'/%3E%3Crect x='3' y='14' width='7' height='7' rx='1'/%3E%3Crect x='14' y='14' width='7' height='7' rx='1'/%3E%3C/svg%3E") center/contain no-repeat; }
    .account-nav-icon[data-icon="user"] { -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M20 21v-2a4 4 0 00-4-4H8a4 4 0 00-4 4v2'/%3E%3Ccircle cx='12' cy='7' r='4'/%3E%3C/svg%3E") center/contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M20 21v-2a4 4 0 00-4-4H8a4 4 0 00-4 4v2'/%3E%3Ccircle cx='12' cy='7' r='4'/%3E%3C/svg%3E") center/contain no-repeat; }
    .account-nav-icon[data-icon="image"] { -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='currentColor' stroke-width='2'%3E%3Crect x='3' y='3' width='18' height='18' rx='2'/%3E%3Ccircle cx='8.5' cy='8.5' r='1.5'/%3E%3Cpath d='M21 15l-5-5L5 21'/%3E%3C/svg%3E") center/contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='currentColor' stroke-width='2'%3E%3Crect x='3' y='3' width='18' height='18' rx='2'/%3E%3Ccircle cx='8.5' cy='8.5' r='1.5'/%3E%3Cpath d='M21 15l-5-5L5 21'/%3E%3C/svg%3E") center/contain no-repeat; }
    .account-nav-icon[data-icon="tag"] { -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M20.59 13.41l-7.17 7.17a2 2 0 01-2.83 0L2 12V2h10l8.59 8.59a2 2 0 010 2.82z'/%3E%3Cline x1='7' y1='7' x2='7.01' y2='7'/%3E%3C/svg%3E") center/contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M20.59 13.41l-7.17 7.17a2 2 0 01-2.83 0L2 12V2h10l8.59 8.59a2 2 0 010 2.82z'/%3E%3Cline x1='7' y1='7' x2='7.01' y2='7'/%3E%3C/svg%3E") center/contain no-repeat; }
    .account-nav-icon[data-icon="star"] { -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='currentColor' stroke-width='2'%3E%3Cpolygon points='12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2'/%3E%3C/svg%3E") center/contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='currentColor' stroke-width='2'%3E%3Cpolygon points='12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2'/%3E%3C/svg%3E") center/contain no-repeat; }
    .account-nav-icon[data-icon="file"] { -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8z'/%3E%3Cpolyline points='14 2 14 8 20 8'/%3E%3C/svg%3E") center/contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8z'/%3E%3Cpolyline points='14 2 14 8 20 8'/%3E%3C/svg%3E") center/contain no-repeat; }
    .account-nav-icon[data-icon="shield"] { -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z'/%3E%3C/svg%3E") center/contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z'/%3E%3C/svg%3E") center/contain no-repeat; }
    .account-nav-icon[data-icon="chart"] { -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='currentColor' stroke-width='2'%3E%3Cline x1='18' y1='20' x2='18' y2='10'/%3E%3Cline x1='12' y1='20' x2='12' y2='4'/%3E%3Cline x1='6' y1='20' x2='6' y2='14'/%3E%3C/svg%3E") center/contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='currentColor' stroke-width='2'%3E%3Cline x1='18' y1='20' x2='18' y2='10'/%3E%3Cline x1='12' y1='20' x2='12' y2='4'/%3E%3Cline x1='6' y1='20' x2='6' y2='14'/%3E%3C/svg%3E") center/contain no-repeat; }
    .account-nav-icon[data-icon="chat"] { -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M21 15a2 2 0 01-2 2H7l-4 4V5a2 2 0 012-2h14a2 2 0 012 2z'/%3E%3C/svg%3E") center/contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M21 15a2 2 0 01-2 2H7l-4 4V5a2 2 0 012-2h14a2 2 0 012 2z'/%3E%3C/svg%3E") center/contain no-repeat; }
    .account-nav-icon[data-icon="clock"] { -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='currentColor' stroke-width='2'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpolyline points='12 6 12 12 16 14'/%3E%3C/svg%3E") center/contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='currentColor' stroke-width='2'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpolyline points='12 6 12 12 16 14'/%3E%3C/svg%3E") center/contain no-repeat; }
    .account-nav-item {
      width: 100%;
      min-height: 45px;
      display: flex;
      align-items: center;
      justify-content: flex-start;
      padding: 10px 12px;
      border: 1px solid rgba(150,177,165,.45);
      border-radius: 12px;
      background: linear-gradient(180deg, rgba(250,251,248,.98), rgba(246,250,244,.94));
      color: var(--dc-text);
      cursor: pointer;
      font: inherit;
      font-size: 13px;
      font-weight: 750;
      text-align: left;
      box-shadow: 0 1px 2px rgba(16,42,56,.04), inset 0 1px 0 rgba(255,255,255,.72);
      transition: background .14s ease, color .14s ease, border-color .14s ease, box-shadow .14s ease, transform .14s ease;
    }
    .account-nav-item:hover {
      background: linear-gradient(180deg, rgba(235,244,233,.98), rgba(218,234,219,.94));
      border-color: rgba(47,107,87,.48);
      color: var(--dc-forest);
      box-shadow: 0 10px 22px rgba(16,42,56,.09);
      transform: translateY(-1px);
    }
    .account-nav-item:hover .account-nav-icon {
      opacity: .95;
    }
    .account-nav-item.is-active {
      color: #fff;
      background: linear-gradient(135deg, var(--dc-forest) 0%, var(--dc-petrol) 100%);
      border-color: rgba(47,107,87,.72);
      font-weight: 800;
      box-shadow: 0 12px 24px rgba(47,107,87,.23);
    }
    .account-nav-item.is-active .account-nav-icon {
      opacity: 1;
    }
    .account-content {
      min-width: 0;
      display: grid;
      gap: 16px;
    }
    .account-context-card {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 16px;
      align-items: center;
      padding: 16px 18px;
      border: 1px solid rgba(205,221,213,.82);
      border-radius: var(--dc-radius);
      background: var(--dc-warm);
      box-shadow: var(--dc-shadow-sm);
    }
    .account-context-card h2 {
      margin: 3px 0 4px;
      font-family: var(--font-display);
      font-size: 20px;
      font-weight: 800;
      color: var(--dc-navy);
    }
    .account-context-card p {
      margin: 0;
      color: var(--dc-text-2);
      font-size: 13px;
      line-height: 1.45;
    }
    .account-context-actions {
      display: inline-flex;
      gap: 4px;
      padding: 4px;
      border: 1px solid rgba(111,155,122,.24);
      border-radius: 999px;
      background: rgba(239,246,238,.92);
    }
    .account-context-button {
      min-height: 34px;
      padding: 7px 14px;
      border: 1px solid transparent;
      border-radius: 999px;
      background: transparent;
      color: var(--dc-text-2);
      cursor: pointer;
      font: inherit;
      font-size: 13px;
      font-weight: 800;
      white-space: nowrap;
      transition: background .14s ease, color .14s ease, border-color .14s ease;
    }
    .account-context-button:hover {
      background: rgba(255,255,255,.72);
      color: var(--dc-forest);
      border-color: rgba(47,107,87,.18);
    }
    .account-context-button.is-active {
      color: #fff;
      background: var(--dc-petrol);
      border-color: var(--dc-petrol);
    }
    .account-commercial-onboarding {
      display: grid;
      gap: 14px;
      padding: 18px;
    }
    .account-commercial-onboarding .account-card-head {
      align-items: center;
      gap: 14px;
    }
    .account-commercial-onboarding-form[hidden] {
      display: none;
    }
    .account-owner-section,
    .account-resident-section {
      display: grid;
      gap: 16px;
    }
    .account-toolbar {
      padding: 18px 20px;
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(220px, 320px);
      gap: 14px;
      align-items: center;
    }
    .account-grid {
      display: grid;
      gap: 12px;
    }
    .account-grid-metrics {
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 14px;
    }
    .account-grid-two {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .account-metrics-toolbar {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      padding: 12px;
      border: 1px solid rgba(196,216,205,.88);
      border-radius: var(--dc-radius);
      background:
        linear-gradient(180deg, rgba(250,251,248,.98), rgba(239,246,238,.88));
      box-shadow: 0 1px 2px rgba(16,42,56,.035), inset 0 1px 0 rgba(255,255,255,.76);
    }
    .account-toolbar-kicker {
      display: block;
      color: var(--dc-muted);
      font-size: 10px;
      font-weight: 800;
      text-transform: uppercase;
      letter-spacing: .07em;
    }
    .account-metrics-toolbar strong {
      display: block;
      margin-top: 2px;
      color: var(--dc-navy);
      font-family: var(--font-display);
      font-size: 14px;
      font-weight: 800;
    }
    .account-segmented {
      display: inline-flex;
      gap: 4px;
      padding: 4px;
      border: 1px solid rgba(111,155,122,.26);
      border-radius: 999px;
      background: rgba(250,251,248,.80);
      box-shadow: inset 0 1px 2px rgba(16,42,56,.04);
    }
    .account-segmented-option {
      min-height: 29px;
      padding: 5px 12px;
      border: 1px solid transparent;
      border-radius: 999px;
      background: transparent;
      color: var(--dc-muted);
      cursor: pointer;
      font: inherit;
      font-size: 12px;
      font-weight: 800;
      transition: background .14s ease, color .14s ease, border-color .14s ease, box-shadow .14s ease;
    }
    .account-segmented-option:hover {
      color: var(--dc-forest);
      background: var(--dc-sage-soft);
    }
    .account-segmented-option.is-active {
      color: #fff;
      background: linear-gradient(135deg, var(--dc-forest), var(--dc-petrol));
      border-color: rgba(47,107,87,.38);
      box-shadow: 0 6px 14px rgba(47,107,87,.18);
    }
    .account-metric {
      --metric-accent: var(--dc-sage);
      --metric-bg: #F4F8F1;
      min-height: 166px;
      padding: 19px;
      display: grid;
      gap: 10px;
      align-content: start;
      position: relative;
      overflow: hidden;
      border-left: 3px solid var(--metric-accent);
      background: linear-gradient(180deg, var(--dc-warm) 0%, var(--metric-bg) 100%);
      box-shadow: 0 1px 2px rgba(16,42,56,.04), 0 10px 22px rgba(16,42,56,.055);
      transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
    }
    .account-metric::after {
      content: "";
      position: absolute;
      inset: 0 0 auto;
      height: 2px;
      background: linear-gradient(90deg, var(--metric-accent), transparent);
      opacity: .55;
      pointer-events: none;
    }
    .account-metric[data-metric-icon="phone"],
    .account-kpi-item[data-metric-icon="phone"] {
      --metric-accent: var(--dc-forest);
      --metric-bg: #EDF6ED;
    }
    .account-metric[data-metric-icon="eye"],
    .account-kpi-item[data-metric-icon="eye"] {
      --metric-accent: var(--dc-petrol);
      --metric-bg: #EAF3F0;
    }
    .account-metric[data-metric-icon="tag"],
    .account-kpi-item[data-metric-icon="tag"] {
      --metric-accent: var(--dc-terracotta);
      --metric-bg: var(--dc-terracotta-soft);
    }
    .account-metric[data-metric-icon="star"],
    .account-kpi-item[data-metric-icon="star"] {
      --metric-accent: #A98D3F;
      --metric-bg: var(--dc-gold-soft);
    }
    .account-metric-icon {
      display: inline-flex;
      width: 18px;
      height: 18px;
      flex: 0 0 auto;
      color: var(--metric-accent, var(--dc-forest));
      background: currentColor;
      filter: drop-shadow(0 1px 1px rgba(16,42,56,.08));
    }
    .account-metric-icon[data-icon="phone"] { -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M22 16.92v3a2 2 0 01-2.18 2 19.79 19.79 0 01-8.63-3.07 19.5 19.5 0 01-6-6A19.79 19.79 0 012.12 4.18 2 2 0 014.11 2h3a2 2 0 012 1.72c.12.9.32 1.77.59 2.61a2 2 0 01-.45 2.11L8 9.69a16 16 0 006.31 6.31l1.25-1.25a2 2 0 012.11-.45c.84.27 1.71.47 2.61.59A2 2 0 0122 16.92z'/%3E%3C/svg%3E") center/contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M22 16.92v3a2 2 0 01-2.18 2 19.79 19.79 0 01-8.63-3.07 19.5 19.5 0 01-6-6A19.79 19.79 0 012.12 4.18 2 2 0 014.11 2h3a2 2 0 012 1.72c.12.9.32 1.77.59 2.61a2 2 0 01-.45 2.11L8 9.69a16 16 0 006.31 6.31l1.25-1.25a2 2 0 012.11-.45c.84.27 1.71.47 2.61.59A2 2 0 0122 16.92z'/%3E%3C/svg%3E") center/contain no-repeat; }
    .account-metric-icon[data-icon="eye"] { -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M1 12s4-7 11-7 11 7 11 7-4 7-11 7S1 12 1 12z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E") center/contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M1 12s4-7 11-7 11 7 11 7-4 7-11 7S1 12 1 12z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E") center/contain no-repeat; }
    .account-metric-icon[data-icon="tag"] { -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M20.59 13.41l-7.17 7.17a2 2 0 01-2.83 0L2 12V2h10l8.59 8.59a2 2 0 010 2.82z'/%3E%3Cline x1='7' y1='7' x2='7.01' y2='7'/%3E%3C/svg%3E") center/contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M20.59 13.41l-7.17 7.17a2 2 0 01-2.83 0L2 12V2h10l8.59 8.59a2 2 0 010 2.82z'/%3E%3Cline x1='7' y1='7' x2='7.01' y2='7'/%3E%3C/svg%3E") center/contain no-repeat; }
    .account-metric-icon[data-icon="star"] { color: var(--metric-accent, #A98D3F); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='currentColor' stroke-width='2'%3E%3Cpolygon points='12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2'/%3E%3C/svg%3E") center/contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='currentColor' stroke-width='2'%3E%3Cpolygon points='12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2'/%3E%3C/svg%3E") center/contain no-repeat; }
    .account-metric-label,
    .account-metric-helper,
    .account-muted {
      color: var(--dc-muted);
      font-weight: 600;
    }
    .account-muted {
      font-size: 11px;
    }
    .account-metric-label {
      display: inline-flex;
      align-items: center;
      gap: 7px;
      color: var(--dc-text-2);
      font-size: 13px;
      font-weight: 800;
      line-height: 1.25;
    }
    .account-metric strong {
      color: var(--dc-navy);
      font-family: var(--font-display);
      font-size: 32px;
      line-height: 1.05;
      font-weight: 800;
      letter-spacing: -.01em;
    }
    .account-metric-unit {
      margin-left: 6px;
      color: var(--dc-muted);
      font-family: var(--font-body);
      font-size: 12px;
      font-weight: 800;
      letter-spacing: 0;
    }
    .account-metric-helper {
      max-width: 34ch;
      font-size: 12px;
      line-height: 1.45;
    }
    .account-metrics-empty {
      grid-column: 1 / -1;
      display: grid;
      grid-template-columns: auto minmax(0, 1fr);
      gap: 10px;
      align-items: center;
      padding: 14px 16px;
      color: var(--dc-text-2);
      font-size: 13px;
      font-weight: 650;
      text-align: left;
      background: linear-gradient(180deg, rgba(234,242,234,.92), rgba(250,251,248,.90));
      border: 1px solid rgba(111,155,122,.26);
      border-radius: var(--dc-radius);
    }
    .account-metrics-empty::before {
      content: "";
      width: 24px;
      height: 24px;
      border-radius: 999px;
      background:
        linear-gradient(90deg, transparent 7px, rgba(47,107,87,.40) 7px 10px, transparent 10px 14px, rgba(47,107,87,.56) 14px 17px, transparent 17px),
        var(--dc-sage-soft);
      border: 1px solid rgba(47,107,87,.18);
      box-shadow: inset 0 0 0 3px rgba(250,251,248,.72);
    }
    .account-metrics-analysis {
      display: grid;
      gap: 16px;
    }
    .account-analytics-header {
      display: flex;
      align-items: flex-end;
      justify-content: space-between;
      gap: 16px;
      padding: 18px;
      border: 1px solid rgba(196,216,205,.86);
      border-radius: var(--dc-radius-lg);
      background:
        radial-gradient(circle at top right, rgba(200,169,90,.13), transparent 34%),
        linear-gradient(135deg, rgba(250,251,248,.98), rgba(236,245,237,.94));
      box-shadow: 0 1px 2px rgba(16,42,56,.035), 0 14px 30px rgba(16,42,56,.07);
    }
    .account-analytics-header h2 {
      margin: 2px 0 4px;
      color: var(--dc-navy);
      font-family: var(--font-display);
      font-size: 22px;
      line-height: 1.12;
      letter-spacing: 0;
    }
    .account-analytics-header p {
      max-width: 56ch;
      margin: 0;
      color: var(--dc-muted);
      font-size: 13px;
      line-height: 1.45;
      font-weight: 650;
    }
    .account-analysis-period {
      display: inline-flex;
      min-height: 30px;
      align-items: center;
      justify-content: center;
      padding: 5px 11px;
      border: 1px solid rgba(47,107,87,.18);
      border-radius: 999px;
      color: var(--dc-forest);
      background: var(--dc-sage-soft);
      font-size: 12px;
      font-weight: 850;
      white-space: nowrap;
    }
    .account-analysis-grid {
      display: grid;
      grid-template-columns: minmax(0, 1.35fr) minmax(280px, .85fr);
      gap: 14px;
      align-items: stretch;
    }
    .account-analysis-card {
      display: grid;
      gap: 13px;
      padding: 18px;
      border: 1px solid rgba(205,221,213,.86);
      border-radius: var(--dc-radius-lg);
      background:
        linear-gradient(180deg, rgba(250,251,248,.99), rgba(246,249,243,.96));
      box-shadow: 0 1px 2px rgba(16,42,56,.035), 0 12px 26px rgba(16,42,56,.065);
      transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
    }
    .account-analysis-card:hover {
      transform: translateY(-2px);
      border-color: rgba(111,155,122,.42);
      box-shadow: 0 16px 34px rgba(16,42,56,.10);
    }
    .account-analysis-card-head {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 12px;
    }
    .account-analysis-card h3 {
      margin: 2px 0 0;
      color: var(--dc-navy);
      font-family: var(--font-display);
      font-size: 16px;
      line-height: 1.2;
      letter-spacing: 0;
    }
    .account-analysis-card p,
    .account-analysis-note {
      margin: 0;
      color: var(--dc-text-2);
      font-size: 13px;
      line-height: 1.48;
      font-weight: 650;
    }
    .account-funnel-card {
      border-left: 4px solid var(--dc-forest);
    }
    .account-funnel-steps {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 10px;
    }
    .account-funnel-steps div {
      min-height: 112px;
      display: grid;
      gap: 5px;
      align-content: center;
      padding: 13px;
      border: 1px solid rgba(196,216,205,.74);
      border-radius: var(--dc-radius);
      background: linear-gradient(180deg, rgba(250,251,248,.98), rgba(238,246,239,.90));
    }
    .account-funnel-steps span,
    .account-funnel-steps small {
      color: var(--dc-muted);
      font-size: 11px;
      font-weight: 800;
    }
    .account-funnel-steps strong {
      color: var(--dc-navy);
      font-family: var(--font-display);
      font-size: clamp(22px, 3vw, 30px);
      line-height: 1.05;
      font-weight: 850;
    }
    .account-insights-card {
      border-left: 4px solid var(--dc-gold);
      background:
        radial-gradient(circle at top right, rgba(200,169,90,.14), transparent 38%),
        linear-gradient(180deg, rgba(250,251,248,.99), rgba(248,244,233,.94));
    }
    .account-insights-list {
      display: grid;
      gap: 10px;
      margin: 0;
      padding: 0;
      list-style: none;
    }
    .account-insights-list li {
      position: relative;
      padding-left: 20px;
      color: var(--dc-text-2);
      font-size: 13px;
      line-height: 1.45;
      font-weight: 680;
    }
    .account-insights-list li::before {
      content: "";
      position: absolute;
      left: 0;
      top: .45em;
      width: 8px;
      height: 8px;
      border-radius: 999px;
      background: var(--dc-gold);
      box-shadow: 0 0 0 4px var(--dc-gold-soft);
    }
    .account-channel-card {
      border-left: 4px solid var(--dc-petrol);
    }
    .account-metric-bars {
      display: grid;
      gap: 11px;
    }
    .account-metric-bar-row {
      --metric-accent: var(--dc-sage);
      display: grid;
      grid-template-columns: 22px minmax(110px, .75fr) minmax(120px, 1fr) auto auto;
      gap: 10px;
      align-items: center;
      padding: 10px 12px;
      border: 1px solid rgba(205,221,213,.74);
      border-radius: var(--dc-radius);
      background: rgba(250,251,248,.72);
    }
    .account-metric-bar-row[data-metric-icon="phone"] { --metric-accent: var(--dc-forest); }
    .account-metric-bar-row[data-metric-icon="eye"] { --metric-accent: var(--dc-petrol); }
    .account-metric-bar-row[data-metric-icon="tag"] { --metric-accent: var(--dc-terracotta); }
    .account-metric-bar-row[data-metric-icon="star"] { --metric-accent: #A98D3F; }
    .account-metric-bar-label {
      color: var(--dc-text);
      font-size: 13px;
      font-weight: 800;
    }
    .account-metric-bar-track {
      position: relative;
      height: 9px;
      overflow: hidden;
      border-radius: 999px;
      background: rgba(196,216,205,.50);
    }
    .account-metric-bar-track span {
      position: absolute;
      inset: 0 auto 0 0;
      width: var(--bar-width);
      border-radius: inherit;
      background: linear-gradient(90deg, var(--metric-accent), rgba(111,155,122,.58));
      box-shadow: 0 0 0 1px rgba(255,255,255,.38) inset;
    }
    .account-metric-bar-row strong {
      color: var(--dc-navy);
      font-family: var(--font-display);
      font-size: 17px;
      font-weight: 850;
      text-align: right;
    }
    .account-metric-bar-row small {
      color: var(--dc-muted);
      font-size: 11px;
      font-weight: 800;
      text-transform: lowercase;
    }
    .account-comparison-card {
      border-left: 4px solid var(--dc-sage);
    }
    .account-comparison-list {
      display: grid;
      gap: 9px;
    }
    .account-comparison-row {
      --metric-accent: var(--dc-sage);
      display: grid;
      grid-template-columns: 22px minmax(120px, 1fr) minmax(120px, auto) minmax(130px, auto);
      gap: 10px;
      align-items: center;
      padding: 11px 12px;
      border: 1px solid rgba(205,221,213,.74);
      border-radius: var(--dc-radius);
      background: rgba(250,251,248,.72);
    }
    .account-comparison-row[data-metric-icon="phone"] { --metric-accent: var(--dc-forest); }
    .account-comparison-row[data-metric-icon="eye"] { --metric-accent: var(--dc-petrol); }
    .account-comparison-row[data-metric-icon="tag"] { --metric-accent: var(--dc-terracotta); }
    .account-comparison-row[data-metric-icon="star"] { --metric-accent: #A98D3F; }
    .account-comparison-row strong {
      color: var(--dc-text);
      font-size: 13px;
      font-weight: 850;
    }
    .account-comparison-row span {
      color: var(--dc-muted);
      font-size: 12px;
      font-weight: 700;
    }
    .account-comparison-row b {
      color: var(--dc-navy);
      font-family: var(--font-display);
      font-size: 15px;
    }
    .account-sponsor-performance-card {
      border-left: 4px solid var(--dc-gold);
      background:
        radial-gradient(circle at top right, rgba(200,169,90,.15), transparent 34%),
        linear-gradient(180deg, rgba(250,251,248,.99), rgba(248,244,233,.94));
    }
    .account-analysis-kv {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 10px;
      margin: 0;
    }
    .account-analysis-kv div {
      padding: 12px;
      border: 1px solid rgba(205,221,213,.74);
      border-radius: var(--dc-radius);
      background: rgba(250,251,248,.76);
    }
    .account-analysis-kv dt {
      color: var(--dc-muted);
      font-size: 11px;
      font-weight: 800;
      text-transform: uppercase;
      letter-spacing: .03em;
    }
    .account-analysis-kv dd {
      margin: 4px 0 0;
      color: var(--dc-navy);
      font-family: var(--font-display);
      font-size: 21px;
      font-weight: 850;
    }
    .account-metrics-empty-educational {
      display: grid;
      grid-template-columns: auto minmax(0, 1fr);
      align-items: start;
      padding: 18px;
    }
    .account-metrics-empty-educational strong {
      display: block;
      margin-bottom: 4px;
      color: var(--dc-navy);
      font-family: var(--font-display);
      font-size: 16px;
    }
    .account-metrics-empty-educational span {
      display: block;
      color: var(--dc-text-2);
      font-size: 13px;
      line-height: 1.45;
    }
    .account-metrics-empty-educational ul {
      display: grid;
      gap: 4px;
      margin: 10px 0 0;
      padding-left: 18px;
      color: var(--dc-muted);
      font-size: 13px;
      line-height: 1.42;
    }
    .account-card {
      padding: 22px;
      border-radius: var(--dc-radius-lg);
      border-color: rgba(196,216,205,.86);
      box-shadow: 0 1px 2px rgba(16,42,56,.04), 0 16px 36px rgba(16,42,56,.09);
      background:
        linear-gradient(180deg, rgba(250,251,248,.98) 0%, rgba(246,249,243,.98) 100%);
      transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
    }
    .account-card-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      margin-bottom: 14px;
      padding-bottom: 12px;
      border-bottom: 1px solid rgba(196,216,205,.72);
    }
    .account-card p {
      color: var(--ink-muted);
      font-size: 13px;
      line-height: 1.45;
    }
    .account-commercial-card {
      display: grid;
      gap: 14px;
    }
    .account-commercial-summary,
    .account-commercial-note,
    .account-card-inner {
      border: 1px solid rgba(205,221,213,.82);
      background: linear-gradient(180deg, rgba(250,251,248,.98) 0%, rgba(239,246,238,.92) 100%);
      border-radius: var(--dc-radius);
      padding: 16px;
      box-shadow: 0 1px 2px rgba(16,42,56,.035);
      transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
    }
    .account-commercial-note {
      color: var(--dc-muted);
      font-size: 12px;
      line-height: 1.5;
    }
    .account-help {
      display: block;
      margin-top: 6px;
      color: var(--dc-muted);
      font-size: 11px;
      line-height: 1.4;
      font-weight: 600;
    }
    .account-card-inner h3 {
      margin: 0;
      font-family: var(--font-display);
      font-size: 15px;
      font-weight: 700;
      letter-spacing: -.01em;
      color: var(--dc-navy);
    }
    .sponsor-duo {
      width: min(1200px, calc(100% - 40px));
      margin: 12px auto 14px;
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 12px;
      align-items: stretch;
    }
    .sponsor-duo[hidden],
    .sponsor-duo.is-empty {
      display: none;
    }
    .sponsor-duo .sponsor-slot {
      width: 100%;
      margin: 0;
    }
    .sponsor-duo {
      min-height: 138px;
    }
    .sponsor-slot {
      width: min(980px, calc(100% - 40px));
      margin: 12px auto 14px;
      min-height: 138px;
      display: grid;
    }
    .sponsor-slot-top {
      margin-top: 10px;
      margin-bottom: 12px;
    }
    .sponsor-slot-inline {
      margin-top: 16px;
      margin-bottom: 14px;
    }
    .sponsor-slot[hidden],
    .sponsor-slot.is-empty {
      display: none;
    }
    .sponsor-slot.is-loading::before,
    .sponsor-slot:empty::before {
      content: "";
      min-height: 116px;
      border: 1px solid rgba(34,56,84,.10);
      border-radius: 8px;
      background: linear-gradient(90deg, #F7FAF8 0%, #EEF5F1 50%, #F7FAF8 100%);
      box-shadow: 0 8px 20px rgba(27,38,59,.04);
    }
    .sponsor-card {
      display: grid;
      grid-template-columns: clamp(148px, 28%, 190px) minmax(0, 1fr);
      gap: 11px;
      align-items: center;
      min-height: 116px;
      padding: 10px;
      border: 1px solid rgba(34,56,84,.12);
      border-radius: 8px;
      background: #fff;
      box-shadow: 0 8px 20px rgba(27,38,59,.06);
    }
    .sponsor-card-image {
      width: 100%;
      aspect-ratio: 16 / 8;
      height: auto;
      object-fit: cover;
      border-radius: 6px;
      background: #f1f4f8;
    }
    .sponsor-fallback-visual {
      position: relative;
      overflow: hidden;
      display: grid;
      place-content: center;
      gap: 4px;
      border: 1px solid #D8E6DA;
      background:
        linear-gradient(135deg, rgba(247,241,221,.96) 0%, rgba(247,241,221,.96) 35%, rgba(238,246,239,.98) 35%, rgba(238,246,239,.98) 70%, rgba(207,224,214,.90) 70%, rgba(207,224,214,.90) 100%);
      color: #0B4A45;
      text-align: center;
    }
    .sponsor-fallback-visual::before,
    .sponsor-fallback-visual::after {
      content: "";
      position: absolute;
      inset: auto 12px 13px 12px;
      height: 7px;
      border-radius: 999px;
      background: rgba(6,48,71,.10);
    }
    .sponsor-fallback-visual::after {
      inset: auto 32px 25px 32px;
      height: 5px;
      background: rgba(200,169,90,.24);
    }
    .sponsor-fallback-visual span {
      position: relative;
      z-index: 1;
      display: inline-grid;
      place-items: center;
      width: 32px;
      height: 32px;
      margin: 0 auto;
      border-radius: 8px;
      background: #063047;
      color: #FFFFFF;
      font-size: 12px;
      font-weight: 850;
      letter-spacing: .02em;
    }
    .sponsor-fallback-visual strong {
      position: relative;
      z-index: 1;
      color: #0B4A45;
      font-size: 12px;
      font-weight: 800;
      letter-spacing: .01em;
    }
    .sponsor-fallback-visual-inline {
      background:
        linear-gradient(135deg, rgba(238,246,239,.98) 0%, rgba(238,246,239,.98) 42%, rgba(246,241,232,.96) 42%, rgba(246,241,232,.96) 72%, rgba(200,169,90,.18) 72%, rgba(200,169,90,.18) 100%);
    }
    .sponsor-card-body {
      display: grid;
      min-width: 0;
      grid-template-columns: minmax(0, 1fr) auto;
      column-gap: 12px;
      row-gap: 3px;
      align-items: center;
    }
    .sponsor-card-meta {
      display: flex;
      min-width: 0;
      flex-wrap: wrap;
      gap: 5px;
      align-items: center;
      grid-column: 1;
    }
    .sponsor-label,
    .sponsor-badge {
      display: inline-flex;
      width: fit-content;
      align-items: center;
      border-radius: 999px;
      padding: 2px 7px;
      font-size: 10px;
      font-weight: 800;
      text-transform: uppercase;
      letter-spacing: .02em;
    }
    .sponsor-label {
      background: rgba(27,38,59,.08);
      color: #334155;
    }
    .sponsor-badge {
      background: rgba(232,178,58,.16);
      color: #7a5200;
    }
    .sponsor-card h3 {
      grid-column: 1;
      margin: 0;
      font-family: var(--font-display);
      font-size: 16px;
      line-height: 1.15;
      letter-spacing: 0;
      overflow-wrap: anywhere;
    }
    .sponsor-card p {
      grid-column: 1;
      display: -webkit-box;
      margin: 0;
      overflow: hidden;
      color: var(--ink-muted);
      font-size: 12px;
      line-height: 1.35;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
    }
    .sponsor-cta {
      display: inline-flex;
      width: fit-content;
      align-items: center;
      justify-content: center;
      grid-column: 2;
      grid-row: 1 / span 3;
      margin-top: 0;
      border-radius: 6px;
      padding: 8px 11px;
      background: var(--green);
      color: #fff;
      font-size: 12px;
      font-weight: 800;
      text-decoration: none;
      white-space: nowrap;
    }
    .sponsor-cta-fallback {
      padding: 0;
      background: transparent;
      color: #0B4A45;
      font-weight: 800;
    }
    .account-status-active,
    .account-status-approved,
    .account-status-published,
    .account-status-accepted,
    .account-status-answered,
    .account-status-verified,
    .account-status-paid,
    .account-status-comped,
    .account-status-featured {
      color: var(--dc-forest);
      background: var(--dc-success-bg);
      border-color: rgba(47,107,87,.22);
    }
    .account-status-sponsored {
      color: #7B621B;
      background: var(--dc-gold-soft);
      border-color: rgba(200,169,90,.38);
    }
    .account-status-expired,
    .account-status-overdue,
    .account-status-rejected,
    .account-status-hidden,
    .account-status-deleted {
      color: var(--dc-danger);
      background: var(--red-bg);
      border-color: rgba(192,57,43,.18);
    }
    .account-status-missing,
    .account-status-none,
    .account-status-pending_manual,
    .account-status-pending_upload,
    .account-status-pending_review,
    .account-status-in_review,
    .account-status-pending,
    .account-status-paused {
      color: var(--dc-warning);
      background: var(--dc-warning-bg);
      border-color: rgba(200,169,90,.36);
    }
    .account-kv {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 10px;
      margin-top: 12px;
    }
    .account-kv div {
      padding-top: 10px;
      border-top: 1px solid var(--dc-border-soft);
    }
    .account-kv dt {
      color: var(--dc-muted);
      font-size: 11px;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: .03em;
    }
    .account-kv dd {
      margin-top: 3px;
      color: var(--dc-text);
      font-size: 13.5px;
      font-weight: 700;
      word-break: break-word;
    }
    .account-profile {
      overflow: hidden;
    }
    .account-form {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .account-span-2 {
      grid-column: 1 / -1;
    }
    .account-zones-field {
      border: 1px solid var(--dc-border-soft);
      border-radius: var(--dc-radius);
      padding: 14px;
    }
    .account-zones-field legend {
      padding: 0 6px;
      color: var(--dc-text-2);
    }
    .account-check-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 8px;
    }
    .account-check {
      min-height: 34px;
      display: flex !important;
      grid-template-columns: none !important;
      align-items: center;
      gap: 8px !important;
      padding: 8px 10px;
      border: 1px solid var(--dc-border-soft);
      border-radius: 8px;
      color: var(--dc-muted);
      background: var(--dc-surface);
      font-size: 12px;
      font-weight: 700;
      transition: border-color .12s ease;
    }
    .account-check:has(input:checked) {
      border-color: rgba(111,155,122,.55);
      color: var(--dc-text);
      background: var(--dc-sage-soft);
    }
    .account-check input {
      width: 15px;
      min-height: 15px;
      padding: 0;
    }
    .account-form-footer {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      padding-top: 4px;
    }
    .account-inline-message {
      color: var(--dc-muted);
      font-size: 13px;
      font-weight: 700;
    }
    .account-inline-message[data-tone="success"] {
      color: var(--dc-success);
    }
    .account-inline-message[data-tone="error"] {
      color: var(--dc-danger);
    }
    .account-classifieds-list {
      display: grid;
      gap: 10px;
    }
    .account-classified {
      display: grid;
      gap: 10px;
      padding: 15px;
      border: 1px solid rgba(205,221,213,.86);
      border-radius: var(--dc-radius);
      background: linear-gradient(180deg, var(--dc-warm), rgba(247,250,244,.96));
      box-shadow: 0 1px 2px rgba(16,42,56,.035);
      transition: border-color .12s ease, box-shadow .12s ease, transform .12s ease;
    }
    .account-classified:hover {
      border-color: rgba(111,155,122,.5);
      box-shadow: var(--dc-shadow);
      transform: translateY(-1px);
    }
    .account-classified-main {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 12px;
      align-items: start;
    }
    .account-classified h3 {
      color: var(--ink);
      font-size: 15px;
      line-height: 1.25;
      font-weight: 700;
    }
    .account-classified p {
      margin-top: 4px;
    }
    .account-classified-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
    }
    .account-classified-actions .btn {
      min-height: 34px;
      padding: 7px 10px;
      font-size: 12px;
    }
    @media (hover: hover) and (pointer: fine) {
      .account-page .account-card:hover,
      .account-page .account-card-inner:hover,
      .account-page .account-metric:hover,
      .account-page .account-kpi-item:hover,
      .account-page .account-classified:hover,
      .account-page .account-media-item:hover {
        transform: translateY(-2px);
        border-color: rgba(47,107,87,.36);
        box-shadow: 0 2px 4px rgba(16,42,56,.045), 0 18px 36px rgba(16,42,56,.10);
      }
      .account-page .btn:hover {
        transform: translateY(-1px);
      }
      .account-page .account-plan-card:hover {
        box-shadow: 0 2px 4px rgba(16,42,56,.045), 0 20px 40px rgba(16,42,56,.11);
      }
      .account-page .account-promo-card:hover {
        border-color: rgba(201,106,74,.32);
      }
      .account-page .account-payment-proof-card:hover {
        border-color: rgba(47,107,87,.40);
      }
    }
    .account-media-card {
      display: grid;
      gap: 12px;
    }
    .account-media-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
      gap: 10px;
    }
    .account-media-context {
      margin-bottom: 10px;
      padding: 9px 11px;
      border: 1px solid var(--line-soft);
      border-radius: 8px;
      background: var(--paper);
      color: var(--ink-2);
      font-size: 12px;
      font-weight: 700;
      overflow-wrap: anywhere;
    }
    .account-media-item {
      display: grid;
      gap: 8px;
      padding: 10px;
      border: 1px solid var(--dc-border-soft);
      border-radius: var(--dc-radius);
      background: var(--dc-surface);
      transition: box-shadow .12s ease;
    }
    .account-media-item:hover {
      box-shadow: var(--dc-shadow-sm);
    }
    .account-media-thumb {
      width: 100%;
      aspect-ratio: 4 / 3;
      border: 1px solid var(--dc-border-soft);
      border-radius: 8px;
      background: var(--dc-sky);
      object-fit: cover;
    }
    .account-media-meta {
      display: grid;
      gap: 4px;
      color: var(--ink-muted);
      font-size: 12px;
      font-weight: 750;
    }
    .account-media-meta .account-status {
      justify-self: start;
      min-height: 24px;
      padding: 3px 8px;
    }
    .account-media-meta small {
      line-height: 1.35;
    }
    .account-media-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
    }
    .account-media-actions .btn {
      min-height: 32px;
      padding: 6px 9px;
      font-size: 12px;
    }
    .account-media-form {
      align-items: end;
    }
    .account-media-preview {
      grid-column: 1 / -1;
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(132px, 1fr));
      gap: 10px;
    }
    .account-media-preview[hidden] {
      display: none;
    }
    .account-media-preview-item {
      display: grid;
      gap: 6px;
      border: 1px solid var(--dc-border-soft);
      border-radius: 8px;
      background: var(--dc-surface);
      padding: 8px;
    }
    .account-media-preview-item img,
    .account-media-preview-item > div[aria-hidden="true"] {
      width: 100%;
      aspect-ratio: 4 / 3;
      border-radius: 6px;
      background: var(--dc-sky);
      object-fit: cover;
    }
    .account-media-preview-item span {
      color: var(--ink);
      font-size: 12px;
      font-weight: 800;
      overflow-wrap: anywhere;
    }
    .account-media-preview-item small {
      color: var(--ink-muted);
      font-size: 11px;
    }
    .account-media-preview-item .btn {
      width: 100%;
      min-height: 32px;
    }
    .account-accordion {
      background: linear-gradient(180deg, rgba(250,251,248,.98), rgba(247,250,244,.96));
      border: 1px solid rgba(205,221,213,.86);
      border-radius: var(--dc-radius);
      box-shadow: 0 1px 2px rgba(16,42,56,.035), 0 9px 22px rgba(16,42,56,.055);
      overflow: hidden;
    }
    .account-section-panel[hidden],
    .account-secondary-panel[hidden] {
      display: none !important;
    }
    .account-section-panel.account-accordion,
    .account-secondary-panel.account-accordion {
      padding: 16px;
    }
    .account-section-panel .account-accordion-trigger,
    .account-secondary-panel .account-accordion-trigger {
      display: none;
    }
    .account-section-panel .account-accordion-panel,
    .account-secondary-panel .account-accordion-panel {
      padding: 0;
    }
    .account-accordion-trigger {
      display: flex;
      align-items: center;
      justify-content: space-between;
      width: 100%;
      padding: 16px 20px;
      margin: 0;
      background: none;
      border: none;
      cursor: pointer;
      font-family: var(--font-display);
      font-size: 15px;
      font-weight: 700;
      letter-spacing: -.01em;
      color: var(--dc-navy);
      text-align: left;
      transition: background .12s ease;
    }
    .account-accordion-trigger:hover {
      background: rgba(234,242,234,.66);
    }
    .account-accordion-trigger[aria-expanded="true"] {
      border-bottom: 1px solid rgba(196,216,205,.72);
      background: rgba(234,242,234,.74);
    }
    .account-accordion-arrow {
      display: inline-block;
      width: 20px;
      height: 20px;
      flex-shrink: 0;
      margin-left: 8px;
      background: var(--dc-muted);
      -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 10l5 5 5-5'/%3E%3C/svg%3E") center/contain no-repeat;
      mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 10l5 5 5-5'/%3E%3C/svg%3E") center/contain no-repeat;
      transition: transform .2s ease;
    }
    .account-accordion-trigger[aria-expanded="true"] .account-accordion-arrow {
      transform: rotate(180deg);
      background: var(--dc-blue);
    }
    .account-accordion-panel {
      padding: 0 20px 20px;
    }
    .account-accordion-panel[hidden] {
      display: none;
    }
    .account-accordion-help {
      margin-bottom: 12px;
      font-size: 13px;
      line-height: 1.45;
    }
    .account-accordion-panel .account-form {
      margin-top: 4px;
    }
    .account-accordion-panel .account-card-inner {
      margin-top: 0;
    }
    .account-accordion-promo-status:empty,
    .account-accordion-billing-status:empty {
      display: none;
    }
    .account-accordion-promo-status,
    .account-accordion-billing-status {
      border: 1px solid rgba(205,221,213,.86);
      background: linear-gradient(180deg, var(--dc-warm), rgba(239,246,238,.88));
      border-radius: 8px;
      padding: 14px;
      margin-bottom: 14px;
    }
    .account-accordion-promo-status {
      border-color: rgba(201,106,74,.22);
      border-left: 3px solid var(--dc-terracotta);
      background:
        radial-gradient(circle at 100% 0%, rgba(201,106,74,.10), transparent 32%),
        linear-gradient(180deg, var(--dc-warm), rgba(251,237,230,.64));
    }
    .account-promos-card {
      border-color: rgba(201,106,74,.20);
      background:
        radial-gradient(circle at 100% 0%, rgba(201,106,74,.08), transparent 32%),
        linear-gradient(180deg, var(--dc-warm), rgba(250,246,239,.96));
    }
    .account-promos-card .account-card-head {
      align-items: flex-start;
    }
    .account-promo-card {
      border-left: 3px solid var(--dc-terracotta);
      background:
        linear-gradient(180deg, var(--dc-warm), rgba(251,237,230,.58));
    }
    .account-promo-card .account-status {
      justify-self: end;
    }
    .account-promo-form {
      margin-top: 14px !important;
      padding-top: 14px;
      border-top: 1px solid rgba(201,106,74,.18);
    }
    .account-dashboard {
      display: grid;
      gap: 14px;
      position: relative;
      overflow: hidden;
      border-color: rgba(111,155,122,.32);
      background:
        radial-gradient(circle at 100% 0%, rgba(200,169,90,.10), transparent 30%),
        linear-gradient(180deg, rgba(250,251,248,.99) 0%, rgba(243,248,241,.98) 100%);
    }
    .account-dashboard::before {
      content: "";
      position: absolute;
      inset: 0 0 auto;
      height: 3px;
      background: linear-gradient(90deg, var(--dc-forest), var(--dc-petrol), transparent);
      opacity: .86;
      pointer-events: none;
    }
    .account-dashboard-body {
      display: grid;
      gap: 14px;
    }
    .account-dashboard-kpi {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 14px;
    }
    .account-dashboard-kpi:empty {
      display: none;
    }
    .account-kpi-item {
      --metric-accent: var(--dc-sage);
      --metric-bg: #F4F8F1;
      display: grid;
      gap: 7px;
      align-content: start;
      min-height: 150px;
      padding: 17px;
      position: relative;
      overflow: hidden;
      border: 1px solid rgba(205,221,213,.82);
      border-left: 3px solid var(--metric-accent);
      border-radius: 0 var(--dc-radius) var(--dc-radius) 0;
      background: linear-gradient(180deg, var(--dc-warm) 0%, var(--metric-bg) 100%);
      box-shadow: 0 1px 2px rgba(16,42,56,.04), 0 8px 18px rgba(16,42,56,.055);
      transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
    }
    .account-kpi-item::after {
      content: "";
      position: absolute;
      inset: 0 0 auto;
      height: 2px;
      background: linear-gradient(90deg, var(--metric-accent), transparent);
      opacity: .45;
      pointer-events: none;
    }
    .account-kpi-label {
      display: inline-flex;
      align-items: center;
      gap: 7px;
      color: var(--dc-text-2);
      font-size: 12.5px;
      font-weight: 800;
      line-height: 1.25;
    }
    .account-kpi-value {
      color: var(--dc-navy);
      font-family: var(--font-display);
      font-size: 27px;
      font-weight: 800;
      line-height: 1.1;
    }
    .account-kpi-unit {
      margin-left: 5px;
      color: var(--dc-muted);
      font-family: var(--font-body);
      font-size: 11px;
      font-weight: 800;
    }
    .account-kpi-help {
      color: var(--dc-muted);
      font-size: 12px;
      font-weight: 600;
      line-height: 1.45;
    }
    .account-dashboard-empty {
      grid-column: 1 / -1;
      display: grid;
      grid-template-columns: auto minmax(0, 1fr);
      gap: 10px;
      align-items: center;
      padding: 14px 16px;
      color: var(--dc-text-2);
      background: linear-gradient(180deg, rgba(234,242,234,.92), rgba(250,251,248,.90));
      border: 1px solid rgba(111,155,122,.26);
      border-radius: var(--dc-radius);
      font-size: 13px;
      font-weight: 650;
      line-height: 1.45;
    }
    .account-dashboard-empty::before {
      content: "";
      width: 24px;
      height: 24px;
      border-radius: 999px;
      background:
        linear-gradient(90deg, transparent 7px, rgba(47,107,87,.40) 7px 10px, transparent 10px 14px, rgba(47,107,87,.56) 14px 17px, transparent 17px),
        var(--dc-sage-soft);
      border: 1px solid rgba(47,107,87,.18);
      box-shadow: inset 0 0 0 3px rgba(250,251,248,.72);
    }
    .account-dashboard-alerts {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
    }
    .account-dashboard-alerts:empty {
      display: none;
    }
    .account-alert {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      padding: 6px 12px;
      border-radius: 8px;
      font-size: 12px;
      font-weight: 700;
      line-height: 1.3;
    }
    .account-alert-warn {
      color: var(--dc-warning);
      background: var(--dc-warning-bg);
      border: 1px solid rgba(200,169,90,.36);
    }
    .account-alert-info {
      color: var(--dc-forest);
      background: var(--dc-success-bg);
      border: 1px solid rgba(47,107,87,.18);
    }
    .account-alert-error {
      color: var(--dc-danger);
      background: var(--red-bg);
      border: 1px solid rgba(192,57,43,.18);
    }
    .account-budget-summary {
      flex: 1 1 100%;
      display: grid;
      gap: 10px;
      padding: 14px;
      border: 1px solid rgba(6,48,71,.10);
      border-radius: 12px;
      background: rgba(255,255,255,.78);
      color: var(--dc-ink);
    }
    .account-budget-summary strong {
      color: var(--dc-ink);
    }
    .account-budget-summary span {
      color: var(--dc-muted);
      font-size: 13px;
      line-height: 1.45;
    }
    .account-budget-summary-head {
      display: flex;
      justify-content: space-between;
      gap: 10px;
      align-items: baseline;
      flex-wrap: wrap;
    }
    .account-budget-list {
      display: grid;
      gap: 8px;
    }
    .account-budget-row {
      display: grid;
      grid-template-columns: .85fr 1.25fr 1fr .9fr auto;
      gap: 8px;
      align-items: center;
      padding: 8px 10px;
      border-radius: 10px;
      background: var(--dc-sage-soft);
    }
    .account-dashboard-cta {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      align-items: center;
      padding-top: 2px;
    }
    .account-dashboard-cta .btn {
      min-height: 36px;
      padding: 8px 14px;
      font-size: 13px;
    }
    .account-dashboard-cta .account-dashboard-primary-cta {
      min-height: 38px;
      padding-inline: 16px;
      box-shadow: 0 10px 20px rgba(47,107,87,.20);
    }
    .account-classifieds-section,
    .account-classified-form-section {
      border: 1px solid rgba(220,231,226,.94);
      background: linear-gradient(180deg, var(--dc-warm) 0%, #F4F8F1 100%);
      border-radius: var(--dc-radius);
      padding: 16px;
      margin-top: 14px;
      box-shadow: var(--dc-shadow-sm);
    }
    .account-classifieds-section:first-child,
    .account-classified-form-section:first-child {
      margin-top: 0;
    }
    .account-plan-status {
      border: 1px solid var(--dc-border-soft);
      background: var(--dc-surface-alt);
      border-radius: var(--dc-radius);
      padding: 14px;
      margin-bottom: 14px;
    }
    .account-plan-status:empty {
      display: none;
    }
    .account-plan-status-head {
      display: flex;
      align-items: center;
      gap: 10px;
      margin-bottom: 8px;
    }
    .account-plan-status-head h3 {
      margin: 0;
      font-family: var(--font-display);
      font-size: 15px;
      font-weight: 700;
    }
    .account-plan-status-alert {
      margin-top: 8px;
      padding: 6px 10px;
      border-radius: 6px;
      background: var(--gold-bg);
      border: 1px solid var(--gold-line);
      color: var(--gold);
      font-size: 12px;
      font-weight: 700;
    }
    .account-plan-cards {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
      gap: 12px;
      margin-bottom: 14px;
    }
    .account-plan-cards:empty {
      display: none;
    }
    .account-plan-card {
      display: flex;
      flex-direction: column;
      gap: 10px;
      padding: 14px;
      border: 1px solid var(--dc-border);
      border-radius: 12px;
      background: var(--dc-warm);
      transition: border-color .15s ease, box-shadow .15s ease;
    }
    .account-plan-card.is-current {
      border-color: rgba(111,155,122,.45);
      background: var(--dc-sage-soft);
    }
    .account-plan-card.is-selected {
      border-color: var(--dc-forest);
      box-shadow: 0 0 0 3px rgba(111,155,122,.18);
    }
    .account-plan-card.is-admin-only {
      opacity: .65;
    }
    .account-plan-card-head {
      display: flex;
      align-items: baseline;
      justify-content: space-between;
      gap: 8px;
    }
    .account-plan-card-head h4 {
      margin: 0;
      font-family: var(--font-display);
      font-size: 14px;
      font-weight: 700;
      line-height: 1.2;
    }
    .account-plan-card-price {
      white-space: nowrap;
      color: var(--dc-forest);
      font-family: var(--font-display);
      font-size: 16px;
      font-weight: 800;
    }
    .account-plan-card-desc {
      color: var(--ink-muted);
      font-size: 12px;
      line-height: 1.4;
      margin: 0;
    }
    .account-plan-card-features {
      list-style: none;
      padding: 0;
      margin: 0;
      display: flex;
      flex-wrap: wrap;
      gap: 6px;
    }
    .account-plan-card-features li {
      padding: 3px 8px;
      border-radius: 6px;
      background: var(--dc-sand);
      border: 1px solid var(--dc-border-soft);
      color: var(--ink-2);
      font-size: 11px;
      font-weight: 700;
    }
    .account-plan-card-action {
      margin-top: auto;
    }
    .account-plan-card-current {
      display: inline-flex;
      align-items: center;
      padding: 4px 10px;
      border-radius: 6px;
      font-size: 11px;
      font-weight: 700;
      color: var(--dc-forest);
      background: var(--dc-sage-soft);
      border: 1px solid rgba(111,155,122,.34);
    }
    .account-plan-card-current.is-admin {
      color: var(--ink-muted);
      background: var(--dc-sand);
      border-color: var(--dc-border-soft);
    }
    .account-plan-card-btn {
      width: 100%;
    }
    .account-plan-payment-flow[hidden] {
      display: none;
    }
    .account-plan-instructions {
      border: 1px solid var(--dc-border);
      background: var(--dc-sage-soft);
      border-radius: 8px;
      padding: 12px;
      margin-bottom: 12px;
    }
    .account-plan-instructions:empty {
      display: none;
    }
    .account-plan-instructions-head {
      display: flex;
      align-items: baseline;
      justify-content: space-between;
      gap: 8px;
      margin-bottom: 8px;
    }
    .account-plan-instructions-head h3 {
      margin: 0;
      font-family: var(--font-display);
      font-size: 15px;
      font-weight: 700;
    }
    .account-plan-instructions-price {
      color: var(--accent);
      font-family: var(--font-display);
      font-size: 18px;
      font-weight: 800;
      white-space: nowrap;
    }
    .account-sponsor-fields {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 12px;
    }
    .account-sponsor-fields[hidden] {
      display: none;
    }
    .account-status-free,
    .account-status-standard,
    .account-status-uploaded {
      color: var(--dc-blue);
      background: rgba(11,74,90,.08);
      border-color: rgba(11,74,90,.16);
    }
    .account-plan-options,
    .account-plan-payment-flow,
    .account-plan-manual-flow {
      display: grid;
      gap: 12px;
      margin-top: 12px;
    }
    .account-plan-manual-flow[hidden],
    .account-plan-payment-flow[hidden] {
      display: none;
    }
    .account-plan-section-head {
      display: flex;
      align-items: end;
      justify-content: space-between;
      gap: 12px;
    }
    .account-plan-section-head h3,
    .account-payment-step h4,
    .account-sponsor-intro h4,
    .account-plan-manual-card h3 {
      margin: 0;
      color: var(--dc-navy);
      font-family: var(--font-display);
      font-size: 16px;
      font-weight: 700;
      letter-spacing: -.01em;
    }
    .account-plan-section-head p,
    .account-payment-step p,
    .account-sponsor-intro p,
    .account-plan-manual-card p {
      margin-top: 3px;
      color: var(--dc-muted);
      font-size: 12px;
      line-height: 1.45;
    }
    .account-plan-status {
      display: grid;
      gap: 12px;
      padding: 18px;
      border-radius: var(--dc-radius);
      border: 1px solid rgba(111,155,122,.24);
      background:
        radial-gradient(circle at 100% 0%, rgba(200,169,90,.10), transparent 28%),
        linear-gradient(180deg, rgba(250,251,248,.98), rgba(234,242,234,.78));
    }
    .account-plan-status-main {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 12px;
      align-items: start;
    }
    .account-plan-status-main h3 {
      margin: 2px 0 4px;
      color: var(--dc-navy);
      font-family: var(--font-display);
      font-size: 22px;
      font-weight: 800;
      letter-spacing: -.01em;
    }
    .account-plan-status-main p {
      max-width: 680px;
      color: var(--dc-muted);
      font-size: 13px;
      line-height: 1.5;
    }
    .account-plan-eyebrow {
      display: inline-flex;
      color: var(--dc-petrol);
      font-size: 11px;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: .04em;
    }
    .account-plan-status-kv,
    .account-plan-instructions-kv {
      grid-template-columns: repeat(auto-fit, minmax(132px, 1fr));
      margin-top: 0;
    }
    .account-plan-status-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
    }
    .account-plan-status-actions .btn {
      min-height: 36px;
      padding: 8px 12px;
      font-size: 12px;
    }
    .account-plan-promo-note,
    .account-plan-manual-card,
    .account-payment-step,
    .account-sponsor-intro {
      border: 1px solid rgba(205,221,213,.86);
      border-radius: 8px;
      background: linear-gradient(180deg, var(--dc-warm), rgba(247,250,244,.96));
      padding: 12px;
    }
    .account-plan-promo-note {
      color: var(--dc-muted);
      font-size: 12px;
      line-height: 1.5;
    }
    .account-plan-promo-note strong {
      color: var(--dc-text);
    }
    .account-plan-cards {
      grid-template-columns: repeat(auto-fit, minmax(238px, 1fr));
      gap: 12px;
      margin-bottom: 0;
    }
    .account-plan-card {
      --plan-accent: rgba(75,95,116,.28);
      --plan-accent-strong: #496070;
      --plan-accent-bg: #F4F8FC;
      min-height: 100%;
      padding: 18px;
      border: 1px solid rgba(205,221,213,.86);
      border-radius: var(--dc-radius);
      background: linear-gradient(180deg, var(--dc-warm), rgba(247,250,244,.96));
      box-shadow: 0 1px 2px rgba(16,42,56,.04), 0 10px 24px rgba(16,42,56,.07);
      align-items: stretch;
      overflow: hidden;
      position: relative;
      transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
    }
    .account-plan-card::before {
      content: "";
      position: absolute;
      top: 0;
      right: 0;
      left: 0;
      height: 3px;
      background: var(--plan-accent-strong);
      opacity: .85;
    }
    .account-plan-card-free {
      --plan-accent: rgba(95,113,109,.25);
      --plan-accent-strong: #5F716D;
      --plan-accent-bg: #F3F6F1;
    }
    .account-plan-card-featured {
      --plan-accent: rgba(111,155,122,.34);
      --plan-accent-strong: var(--dc-forest);
      --plan-accent-bg: var(--dc-sage-soft);
    }
    .account-plan-card-rotating {
      --plan-accent: rgba(200,169,90,.42);
      --plan-accent-strong: #8B7331;
      --plan-accent-bg: var(--dc-gold-soft);
    }
    .account-plan-card-exclusive {
      --plan-accent: rgba(11,74,69,.30);
      --plan-accent-strong: var(--dc-petrol);
      --plan-accent-bg: #E6F0ED;
    }
    .account-plan-card.is-admin-only {
      opacity: 1;
    }
    .account-plan-card.is-current {
      border-color: var(--plan-accent);
      background: var(--dc-surface-alt);
    }
    .account-plan-card-head {
      align-items: start;
      min-height: 46px;
    }
    .account-plan-card-head h4 {
      font-size: 15px;
    }
    .account-plan-card-head span {
      display: inline-flex;
      margin-top: 2px;
      color: var(--ink-muted);
      font-size: 11px;
      font-weight: 700;
    }
    .account-plan-card-price {
      font-size: 18px;
      letter-spacing: 0;
    }
    .account-plan-card-subtitle {
      margin: 0;
      color: var(--ink);
      font-size: 12px;
      font-weight: 700;
      line-height: 1.35;
      min-height: 17px;
    }
    .account-plan-card-desc {
      min-height: 68px;
    }
    .account-plan-type {
      display: inline-flex;
      width: fit-content;
      align-items: center;
      border-radius: 999px;
      padding: 3px 8px;
      color: var(--plan-accent-strong);
      background: var(--plan-accent-bg);
      border: 1px solid var(--plan-accent);
      font-size: 10px;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: .04em;
    }
    .account-plan-card-features {
      display: grid;
      gap: 6px;
      margin-top: 2px;
    }
    .account-plan-card-features li {
      position: relative;
      padding: 0 0 0 16px;
      border: none;
      background: transparent;
      color: var(--ink-2);
      font-size: 12px;
      line-height: 1.35;
    }
    .account-plan-card-features li::before {
      content: "";
      position: absolute;
      left: 0;
      top: .55em;
      width: 6px;
      height: 6px;
      border-radius: 999px;
      background: var(--plan-accent-strong);
    }
    .account-plan-card-note {
      margin: 0;
      padding: 8px 10px;
      border-radius: 8px;
      background: var(--dc-surface-alt);
      border: 1px solid var(--dc-border-soft);
      color: var(--dc-muted);
      font-size: 11px;
      font-weight: 700;
      line-height: 1.4;
    }
    .account-plan-card-action {
      display: grid;
      margin-top: auto;
    }
    .account-plan-card-current {
      justify-self: start;
      width: fit-content;
      border-radius: 999px;
      color: var(--plan-accent-strong);
      background: var(--plan-accent-bg);
      border-color: var(--plan-accent);
      cursor: default;
      pointer-events: none;
      box-shadow: none;
      font-weight: 700;
    }
    .account-plan-card-btn {
      min-height: 42px;
    }
    @media (hover: hover) and (pointer: fine) {
      .account-plan-card:hover {
        border-color: var(--plan-accent);
        box-shadow: var(--dc-shadow-lg);
        transform: translateY(-2px);
      }
    }
    @media (prefers-reduced-motion: reduce) {
      .account-plan-card {
        transition: none;
      }
      .account-plan-card:hover {
        transform: none;
      }
    }
    .account-plan-instructions {
      display: grid;
      gap: 12px;
      border-color: rgba(111,155,122,.26);
      background: linear-gradient(180deg, rgba(250,251,248,.98), rgba(234,242,234,.84));
      border-radius: var(--dc-radius);
      margin-bottom: 0;
    }
    .account-plan-instructions-head {
      align-items: start;
    }
    .account-plan-instructions-head p {
      max-width: 680px;
      margin-top: 4px;
      color: var(--dc-muted);
      font-size: 12px;
      line-height: 1.45;
    }
    .account-payment-step {
      display: grid;
      gap: 12px;
    }
    .account-payment-upload {
      padding: 18px;
      border-style: dashed;
      border-color: rgba(47,107,87,.42);
      background:
        radial-gradient(circle at top right, rgba(111,155,122,.16), transparent 34%),
        linear-gradient(180deg, rgba(250,251,248,.98), rgba(234,242,234,.82));
    }
    .account-payment-step-head {
      display: grid;
      grid-template-columns: auto minmax(0, 1fr);
      gap: 10px;
      align-items: start;
    }
    .account-payment-step-head > span {
      display: inline-flex;
      width: 28px;
      height: 28px;
      align-items: center;
      justify-content: center;
      border-radius: 999px;
      color: #fff;
      background: linear-gradient(135deg, var(--dc-forest), var(--dc-sage));
      font-size: 12px;
      font-weight: 800;
      box-shadow: 0 2px 8px rgba(47,107,87,.22);
    }
    .account-payment-proof-card {
      border-color: rgba(47,107,87,.28);
      border-left: 3px solid var(--dc-forest);
      background: linear-gradient(180deg, var(--dc-warm), #F1F7EF);
    }
    .account-payment-proof-card .account-classified-actions {
      padding-top: 2px;
    }
    .account-fieldset-copy {
      margin: -2px 0 2px;
      color: var(--dc-muted);
      font-size: 12px;
      line-height: 1.45;
      font-weight: 600;
    }
    .account-sponsor-intro {
      background: linear-gradient(180deg, var(--dc-warm), var(--dc-gold-soft));
      border-color: rgba(200,169,90,.34);
    }
    .account-page .sponsor-card {
      border-color: rgba(200,169,90,.24);
      background: linear-gradient(180deg, #fff, #FEFCF4);
      box-shadow: 0 8px 20px rgba(27,38,59,.055);
    }
    .account-page .sponsor-label {
      background: rgba(11,74,69,.08);
      color: var(--dc-petrol);
    }
    .account-page .sponsor-badge {
      background: rgba(200,169,90,.16);
      color: #7A6120;
    }
    .account-page .account-footer {
      margin-top: 0;
      padding: 18px 0 22px;
      border-top: 1px solid rgba(196,216,205,.72);
      background: linear-gradient(180deg, rgba(246,241,232,.86), rgba(250,251,248,.96));
    }
    .account-footer-inner {
      align-items: center;
    }
    .account-footer-copy {
      margin: 0;
      color: var(--dc-muted);
      font-size: 12px;
      font-weight: 650;
    }
    .account-footer-links {
      gap: 12px;
    }
    .account-page .account-footer .footer-link {
      color: var(--dc-text-2);
      font-size: 12px;
      font-weight: 750;
      transition: color .14s ease, transform .14s ease;
    }
    .account-page .account-footer .footer-link:hover {
      color: var(--dc-forest);
      transform: translateY(-1px);
    }
    .account-footer-toast {
      border-color: rgba(47,107,87,.22);
      background: var(--dc-petrol);
      color: #fff;
      box-shadow: 0 18px 38px rgba(16,42,56,.20);
    }
    @media (prefers-reduced-motion: reduce) {
      .account-page .btn,
      .account-back-link,
      .account-page .account-card,
      .account-page .account-card-inner,
      .account-page .account-analysis-card,
      .account-page .account-metric,
      .account-page .account-kpi-item,
      .account-page .account-classified,
      .account-page .account-media-item,
      .account-page .account-plan-card,
      .account-page .account-nav-item,
      .account-page .footer-link {
        transition: none !important;
      }
      .account-page .btn:hover,
      .account-back-link:hover,
      .account-page .account-card:hover,
      .account-page .account-card-inner:hover,
      .account-page .account-analysis-card:hover,
      .account-page .account-metric:hover,
      .account-page .account-kpi-item:hover,
      .account-page .account-classified:hover,
      .account-page .account-media-item:hover,
      .account-page .account-plan-card:hover,
      .account-page .account-nav-item:hover,
      .account-page .footer-link:hover {
        transform: none !important;
      }
    }
    @media (max-width: 980px) {
      .account-app {
        grid-template-columns: 1fr;
      }
      .account-sidebar {
        position: static;
        top: auto;
      }
      .account-sidebar-card {
        display: none;
      }
      .account-mobile-section-control {
        display: block;
      }
      .account-section-nav {
        display: none;
      }
      .account-nav-group {
        display: none;
      }
      .account-grid-metrics {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
      .account-auth-panel,
      .account-grid-two {
        grid-template-columns: 1fr;
      }
    }
    @media (max-width: 680px) {
      .account-page .topbar .w {
        min-height: 50px;
        align-items: center;
        gap: 7px;
        padding-top: 7px;
        padding-bottom: 7px;
        flex-wrap: nowrap;
      }
      .account-back-link {
        width: 30px;
        height: 30px;
        font-size: 16px;
      }
      .account-page .logo-mark {
        width: 30px;
        height: 30px;
        border-radius: 8px;
      }
      .account-page .logo-text {
        font-size: 14px !important;
      }
      .account-page .top-actions {
        gap: 5px;
        min-width: 0;
      }
      .account-page .top-actions .btn {
        min-height: 30px;
        padding: 4px 8px;
        font-size: 11.5px;
      }
      .account-page .top-actions .account-pill {
        min-height: 20px;
        padding: 2px 7px;
        font-size: 9px;
      }
      .account-hero,
      .account-demo-switch,
      .account-context-card,
      .account-toolbar,
      .account-form {
        grid-template-columns: 1fr;
      }
      .account-context-actions {
        width: 100%;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        border-radius: 12px;
      }
      .account-context-button {
        width: 100%;
        border-radius: 9px;
      }
      .account-commercial-onboarding .account-card-head {
        grid-template-columns: 1fr;
      }
      .account-shell {
        padding-top: 10px;
        padding-bottom: 32px;
      }
      .account-hero {
        padding: 13px 15px;
      }
      .account-page .account-hero .account-context-card {
        width: 100%;
        justify-self: stretch;
        padding: 11px;
      }
      .account-hero .crumb {
        font-size: 11px;
      }
      .account-hero h1 {
        font-size: 20px;
      }
      .account-hero p {
        font-size: 12.5px;
      }
      .account-mobile-section-control .account-select {
        min-height: 46px;
        border-color: rgba(47,107,87,.32);
        background: var(--dc-warm);
        color: var(--dc-text);
        font-size: 16px;
        font-weight: 700;
      }
      .account-demo-actions {
        justify-content: stretch;
      }
      .account-demo-actions .btn {
        flex: 1 1 100%;
      }
      .account-auth-actions {
        display: grid;
        grid-template-columns: 1fr;
      }
      .account-auth-actions .btn {
        width: 100%;
        min-width: 0;
      }
      .account-hero-side {
        justify-content: flex-start;
      }
      .account-grid-metrics,
      .account-check-grid,
      .account-kv,
      .account-classified-main,
      .account-fieldset,
      .account-media-form,
      .account-sponsor-fields {
        grid-template-columns: 1fr;
      }
      .account-plan-cards {
        grid-template-columns: 1fr;
      }
      .account-plan-status-main,
      .account-payment-step-head {
        grid-template-columns: 1fr;
      }
      .account-plan-status-main .account-status {
        justify-self: start;
      }
      .account-plan-status-actions {
        display: grid;
        grid-template-columns: 1fr;
      }
      .account-plan-card-head {
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
      }
      .account-plan-instructions-head {
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
      }
      .account-auth-panel,
      .account-card,
      .account-toolbar {
        padding: 16px;
      }
      .account-auth-panel {
        border-left-width: 3px;
      }
      .account-form-footer {
        align-items: stretch;
        flex-direction: column;
      }
      .account-form-footer .btn {
        width: 100%;
      }
      .account-accordion-trigger {
        padding: 14px 16px;
        font-size: 14.5px;
      }
      .account-accordion-panel {
        padding: 0 16px 16px;
      }
      .account-dashboard-kpi {
        grid-template-columns: 1fr;
      }
      .account-budget-row {
        grid-template-columns: 1fr;
      }
      .account-metrics-toolbar {
        align-items: stretch;
        flex-direction: column;
      }
      .account-analytics-header,
      .account-analysis-grid,
      .account-funnel-steps,
      .account-analysis-kv {
        grid-template-columns: 1fr;
      }
      .account-analytics-header {
        align-items: flex-start;
        padding: 15px;
      }
      .account-analysis-period {
        width: 100%;
      }
      .account-analysis-card {
        padding: 15px;
      }
      .account-metric-bar-row,
      .account-comparison-row {
        grid-template-columns: 22px minmax(0, 1fr) auto;
        gap: 8px;
      }
      .account-metric-bar-row .account-metric-icon,
      .account-comparison-row .account-metric-icon {
        grid-column: 1;
        grid-row: 1;
      }
      .account-metric-bar-label,
      .account-comparison-row strong {
        grid-column: 2;
        grid-row: 1;
      }
      .account-metric-bar-row strong {
        grid-column: 3;
        grid-row: 1;
      }
      .account-metric-bar-track {
        grid-row: 2;
        grid-column: 2 / -1;
      }
      .account-metric-bar-row small {
        grid-column: 3;
        grid-row: 3;
        text-align: right;
      }
      .account-comparison-row span {
        grid-column: 2 / -1;
      }
      .account-segmented {
        width: 100%;
      }
      .account-segmented-option {
        flex: 1 1 0;
        padding-inline: 8px;
        min-height: 34px;
      }
      .account-metrics-empty,
      .account-dashboard-empty {
        align-items: start;
        padding: 13px;
      }
      .account-kpi-item {
        min-height: auto;
        padding: 12px;
      }
      .account-kpi-value {
        font-size: 21px;
      }
      .account-dashboard-cta {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
      .account-dashboard-cta .btn {
        width: 100%;
        justify-content: center;
        min-height: 42px;
        padding: 8px 10px;
        white-space: normal;
      }
      .account-dashboard-cta .account-dashboard-primary-cta {
        grid-column: 1 / -1;
        min-height: 44px;
      }
      .account-dashboard-cta .btn:not(.account-dashboard-primary-cta):last-child {
        grid-column: 1 / -1;
      }
      .account-footer-inner {
        align-items: flex-start;
        gap: 10px;
      }
      .account-footer-links {
        width: 100%;
        justify-content: flex-start;
      }
      .sponsor-duo {
        grid-template-columns: 1fr;
        width: min(100% - 16px, 430px);
        margin: 14px auto 18px;
        gap: 12px;
        min-height: 136px;
      }
      .sponsor-duo .sponsor-slot {
        width: 100%;
        margin: 0;
      }
      .sponsor-slot {
        width: min(100% - 16px, 430px);
        margin: 14px auto 18px;
        min-height: 136px;
      }
      .sponsor-slot-inline {
        margin-top: 24px;
      }
      .sponsor-card {
        grid-template-columns: clamp(132px, 44%, 154px) minmax(0, 1fr);
        gap: 10px;
        min-height: auto;
        padding: 10px;
      }
      .sponsor-card-image {
        width: 100%;
      }
      .sponsor-card-body {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
      }
      .sponsor-card h3 {
        font-size: 14px;
      }
      .sponsor-card p {
        font-size: 12px;
        line-height: 1.3;
      }
      .sponsor-cta {
        margin-top: 2px;
        padding: 7px 10px;
        font-size: 12px;
      }
    }

    /* Public visual normalization sprint */
    body:not(.account-page) {
      --bg: var(--dc-sand);
      --card: var(--dc-warm-white);
      --card-hover: #F7FAF3;
      --ink: var(--dc-text);
      --ink-2: #1F3434;
      --ink-muted: #607575;
      --ink-light: #7C8D86;
      --line: #E3EBE8;
      --line-soft: #EEF3EF;
      --accent: var(--dc-navy);
      --accent-2: var(--dc-forest);
      --accent-bg: #EEF6EF;
      --accent-line: #CFE0D6;
      --gold: #9C7D2F;
      --gold-bg: #FBF4DF;
      --gold-line: rgba(200,169,90,.28);
      --green-dk: var(--dc-forest);
      --green-bg: #EEF6EF;
      --red: #A84F3C;
      --red-bg: #FCF0EA;
      --radius: 8px;
      --radius-lg: 10px;
      --shadow: 0 1px 2px rgba(16,42,56,.04);
      --shadow-lift: 0 1px 2px rgba(16,42,56,.05), 0 8px 18px rgba(16,42,56,.06);
      font-size: 14px;
      line-height: 1.45;
      color: var(--ink-2);
      background:
        radial-gradient(circle at 12% -12%, rgba(111,155,122,.10), transparent 28%),
        linear-gradient(180deg, var(--dc-warm-white) 0%, var(--dc-sand) 320px);
    }

    body:not(.account-page) h1,
    body:not(.account-page) h2,
    body:not(.account-page) h3 {
      color: var(--ink);
      letter-spacing: 0;
    }

    body:not(.account-page) .w {
      padding-left: 20px;
      padding-right: 20px;
    }

    body:not(.account-page) .topbar {
      background: rgba(250,251,248,.94);
      border-bottom-color: rgba(227,235,232,.96);
      box-shadow: 0 1px 2px rgba(16,42,56,.035);
    }

    body:not(.account-page) .topbar .w {
      min-height: 58px;
      gap: 13px;
    }

    body:not(.account-page) .logo-mark {
      width: 34px;
      height: 34px;
      border-radius: 8px;
      background: linear-gradient(135deg, var(--dc-navy), var(--dc-petrol));
      box-shadow: 0 1px 2px rgba(16,42,56,.08);
    }

    body:not(.account-page) .logo-text {
      font-size: 17px;
      font-weight: 760;
      letter-spacing: 0;
    }

    body:not(.account-page) .search-wrap {
      max-width: 540px;
    }

    body:not(.account-page) .search-wrap input,
    body:not(.account-page) .filter-input,
    body:not(.account-page) .filter-select {
      height: 40px;
      border-color: var(--line);
      border-radius: 8px;
      background: rgba(250,251,248,.96);
      color: var(--ink);
      font-size: 13px;
      font-weight: 500;
      box-shadow: none;
    }

    body:not(.account-page) .search-wrap input {
      border-radius: 999px;
    }

    body:not(.account-page) .search-wrap input:focus,
    body:not(.account-page) .filter-input:focus,
    body:not(.account-page) .filter-select:focus {
      border-color: var(--accent-line);
      box-shadow: 0 0 0 3px rgba(47,107,87,.10);
    }

    body:not(.account-page) .btn {
      min-height: 36px;
      padding: 0 14px;
      border-color: var(--line);
      border-radius: 999px;
      background: rgba(250,251,248,.96);
      color: var(--ink);
      font-size: 13px;
      font-weight: 700;
      box-shadow: none;
    }

    body:not(.account-page) .btn:hover {
      transform: translateY(-1px);
      border-color: var(--accent-line);
      background: #F5FAF6;
      box-shadow: 0 1px 2px rgba(16,42,56,.04);
    }

    body:not(.account-page) .btn-sm {
      min-height: 30px;
      padding: 0 10px;
      font-size: 12px;
    }

    body:not(.account-page) .btn-accent {
      background: var(--dc-forest);
      border-color: var(--dc-forest);
      color: #fff;
      box-shadow: 0 1px 2px rgba(47,107,87,.12);
    }

    body:not(.account-page) .btn-accent:hover {
      background: var(--dc-petrol);
      border-color: var(--dc-petrol);
    }

    body:not(.account-page) .btn-soft,
    body:not(.account-page) .btn-ghost {
      background: #F5FAF6;
      border-color: var(--accent-line);
      color: var(--dc-forest);
    }

    body:not(.account-page) .btn-wa {
      background: #EAF6EF;
      border-color: #C9DFD2;
      color: #1F5A3E;
      font-weight: 760;
    }

    body:not(.account-page) .zones {
      background: rgba(250,251,248,.82);
      border-bottom-color: var(--line);
    }

    body:not(.account-page) .zones .w {
      gap: 4px;
    }

    body:not(.account-page) .zone-btn {
      padding: 9px 12px;
      color: var(--ink-muted);
      font-size: 12px;
      font-weight: 650;
    }

    body:not(.account-page) .zone-btn.on {
      color: var(--dc-forest);
      font-weight: 760;
    }

    body:not(.account-page) .zone-btn.on::after {
      left: 12px;
      right: 12px;
      height: 2px;
      background: var(--dc-forest);
    }

    body:not(.account-page) .public-community-strip,
    body:not(.account-page) .tagline-strip {
      margin-bottom: 8px !important;
      background: #F7FAF8 !important;
      border-bottom: 1px solid #E4ECE8 !important;
      box-shadow: inset 0 -1px 0 rgba(255,255,255,.74) !important;
    }

    body:not(.account-page) .public-community-strip .w.tagline-inner,
    body:not(.account-page) .tagline-strip .w.tagline-inner {
      min-height: 48px !important;
      gap: 2px !important;
      padding-top: 8px !important;
      padding-bottom: 8px !important;
    }

    body:not(.account-page) .tagline-main {
      color: var(--dc-petrol) !important;
      font-size: 14px !important;
      line-height: 1.16 !important;
      font-weight: 760 !important;
      letter-spacing: 0 !important;
    }

    body:not(.account-page) .tagline-sub {
      color: var(--ink-muted) !important;
      font-size: 12.5px !important;
      line-height: 1.28 !important;
      font-style: normal !important;
      font-weight: 600 !important;
      letter-spacing: 0 !important;
    }

    body:not(.account-page) .module-strip,
    body:not(.account-page) .module-wrap {
      padding-top: 12px;
    }

    body:not(.account-page) .module-links,
    body:not(.account-page) .module-nav {
      display: grid;
      grid-template-columns: repeat(8, minmax(0, 1fr));
      overflow: hidden;
      border-color: var(--line);
      border-radius: 10px;
      background: rgba(250,251,248,.98);
      box-shadow: var(--shadow);
    }

    body:not(.account-page) .module-nav {
      border-radius: 10px 10px 0 0;
    }

    body:not(.account-page) .module-link,
    body:not(.account-page) .module-tab {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      justify-content: center;
      min-height: 64px;
      padding: 13px 14px;
      border-right: 1px solid var(--line-soft);
      border-color: var(--line-soft);
      background: transparent;
      color: var(--ink-muted);
      text-align: left;
      line-height: 1.15;
      transition: transform .14s ease, background .14s ease, color .14s ease, box-shadow .14s ease;
    }

    body:not(.account-page) .module-link:last-child,
    body:not(.account-page) .module-tab:last-child {
      border-right: 0;
    }

    body:not(.account-page) .module-link,
    body:not(.account-page) .module-tab strong {
      font-size: 14.5px;
      font-weight: 750;
      letter-spacing: 0;
    }

    body:not(.account-page) .module-link span,
    body:not(.account-page) .module-tab span {
      margin-top: 3px;
      color: var(--ink-muted);
      font-size: 12px;
      font-weight: 500;
      line-height: 1.2;
    }

    body:not(.account-page) .module-link:hover,
    body:not(.account-page) .module-tab:hover {
      transform: translateY(-1px);
      background: #F5FAF6;
      color: var(--dc-petrol);
    }

    body:not(.account-page) .module-link.on,
    body:not(.account-page) .module-tab.on {
      background: #F5FBF8;
      color: var(--dc-forest);
      box-shadow: inset 0 -3px 0 var(--dc-forest);
    }

    body:not(.account-page) .module-link.on span,
    body:not(.account-page) .module-tab.on span {
      color: var(--dc-forest);
    }

    body:not(.account-page) .module-wrap .module-nav {
      border-radius: 10px;
    }

    body:not(.account-page) .module-wrap .main-panel {
      margin-top: 14px;
      border-top: 1px solid var(--line);
      border-radius: 10px;
    }

    body:not(.account-page) .page {
      padding-top: 16px;
      padding-bottom: 34px;
    }

    body:not(.account-page) .hero,
    body:not(.account-page) .public-module-hero,
    body:not(.account-page) .panel,
    body:not(.account-page) .main-panel,
    body:not(.account-page) .side-box,
    body:not(.account-page) .sponsor-card {
      border-color: var(--line);
      border-radius: 10px;
      background: var(--card);
      box-shadow: var(--shadow);
    }

    body:not(.account-page) .main-panel {
      border-top: 0;
      border-radius: 0 0 10px 10px;
    }

    body:not(.account-page) .module-wrap .main-panel {
      border-top: 1px solid var(--line);
      border-radius: 10px;
    }

    body:not(.account-page) .hero-main,
    body:not(.account-page) .panel-head,
    body:not(.account-page) .module-helper,
    body:not(.account-page) .filters {
      background: #F8FAF6;
      border-color: var(--line-soft);
    }

    body:not(.account-page) .hero-main {
      padding: 22px 22px 20px;
      gap: 18px;
    }

    body:not(.account-page) .crumb {
      margin-bottom: 8px;
      color: var(--dc-forest);
      font-size: 12px;
      font-weight: 700;
      letter-spacing: 0;
    }

    body:not(.account-page) .hero h1,
    body:not(.account-page) .hero-card h1 {
      font-size: 30px;
      line-height: 1.08;
      font-weight: 780;
      letter-spacing: 0;
    }

    body:not(.account-page) .hero p,
    body:not(.account-page) .hero-card p {
      max-width: 720px;
      margin-top: 6px;
      color: var(--ink-muted);
      font-size: 14px;
      line-height: 1.48;
      font-weight: 450;
    }

    body:not(.account-page) .hero-stats {
      border-top-color: var(--line-soft);
      background: #FAFBF8;
    }

    body:not(.account-page) .stat {
      padding: 11px 18px;
      border-color: var(--line-soft);
    }

    body:not(.account-page) .stat strong {
      color: var(--dc-forest);
      font-size: 17px;
      font-weight: 760;
      letter-spacing: 0;
    }

    body:not(.account-page) .stat span {
      color: var(--ink-muted);
      font-size: 11px;
      line-height: 1.3;
    }

    body:not(.account-page) .content-grid {
      gap: 16px;
      margin-top: 16px;
    }

    body:not(.account-page) .panel-head {
      padding: 15px 16px;
      gap: 12px;
    }

    body:not(.account-page) .panel-head h2,
    body:not(.account-page) .panel-title h1 {
      font-size: 20px;
      line-height: 1.18;
      font-weight: 750;
      letter-spacing: 0;
    }

    body:not(.account-page) .panel-head p,
    body:not(.account-page) .panel-title p,
    body:not(.account-page) .module-helper,
    body:not(.account-page) .side-box p,
    body:not(.account-page) .notice,
    body:not(.account-page) .empty-state {
      color: var(--ink-muted);
      font-size: 12.5px;
      line-height: 1.45;
      font-weight: 450;
    }

    body:not(.account-page) .filters {
      padding: 12px 16px;
      gap: 8px;
    }

    body:not(.account-page) .module-wrap .module-helper {
      display: flex;
      justify-content: space-between;
      gap: 12px;
      flex-wrap: wrap;
      padding: 12px 16px;
      border-top: 1px solid var(--line-soft);
      border-bottom: 1px solid var(--line-soft);
    }

    body:not(.account-page) .item,
    body:not(.account-page) .row-item,
    body:not(.account-page) .compact-row,
    body:not(.account-page) .kids-card {
      border-color: var(--line-soft);
      background: var(--card);
      box-shadow: none;
      transition: transform .14s ease, border-color .14s ease, background .14s ease, box-shadow .14s ease;
    }

    body:not(.account-page) .item,
    body:not(.account-page) .row-item {
      padding: 15px 16px;
      gap: 13px;
    }

    body:not(.account-page) .module-wrap .row-item {
      display: grid;
      grid-template-columns: 64px minmax(0, 1fr) auto;
      align-items: start;
      gap: 14px;
      padding: 18px 16px;
      border-bottom: 1px solid var(--line-soft);
    }

    body:not(.account-page) .compact-row {
      padding: 12px 16px;
    }

    body:not(.account-page) .module-wrap .compact-row {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      align-items: center;
      gap: 12px;
      border-bottom: 1px solid var(--line-soft);
    }

    body:not(.account-page) .item:hover,
    body:not(.account-page) .row-item:hover,
    body:not(.account-page) .compact-row:hover,
    body:not(.account-page) .kids-card:hover,
    body:not(.account-page) .side-box:hover,
    body:not(.account-page) .sponsor-card:hover {
      transform: translateY(-1px);
      border-color: #D5E2DC;
      background: #FDFEFC;
      box-shadow: var(--shadow-lift);
    }

    body:not(.account-page) .item h3,
    body:not(.account-page) .row-info h3,
    body:not(.account-page) .compact-row strong,
    body:not(.account-page) .kids-card h3 {
      font-size: 15px;
      line-height: 1.24;
      font-weight: 700;
      letter-spacing: 0;
    }

    body:not(.account-page) .item p,
    body:not(.account-page) .row-info p,
    body:not(.account-page) .compact-row span,
    body:not(.account-page) .kids-card p {
      color: var(--ink-muted);
      font-size: 13px;
      line-height: 1.45;
      font-weight: 450;
    }

    body:not(.account-page) .module-wrap .row-info h3 {
      display: flex;
      align-items: center;
      gap: 6px;
      flex-wrap: wrap;
    }

    body:not(.account-page) .module-wrap .row-tags,
    body:not(.account-page) .module-wrap .compact-meta {
      display: flex;
      flex-wrap: wrap;
      gap: 5px;
      margin-top: 7px;
    }

    body:not(.account-page) .module-wrap .row-end {
      display: flex;
      flex-direction: column;
      align-items: flex-end;
      gap: 7px;
      min-width: 112px;
    }

    body:not(.account-page) .module-wrap .compact-actions {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      gap: 6px;
    }

    body:not(.account-page) .badge,
    body:not(.account-page) .row-badge,
    body:not(.account-page) .card-thumb,
    body:not(.account-page) .kids-card-mark {
      border-color: var(--line);
      border-radius: 8px;
      background: #F2F7F2;
      color: var(--dc-forest);
      box-shadow: none;
    }

    body:not(.account-page) .module-wrap .row-badge {
      width: 64px;
      height: 52px;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      flex: 0 0 64px;
      font-weight: 800;
      line-height: 1;
      overflow: hidden;
      text-align: center;
    }

    body:not(.account-page) .module-wrap .row-badge.promo .n {
      display: block;
      font-size: 18px;
      letter-spacing: 0;
    }

    body:not(.account-page) .module-wrap .row-badge.promo .l {
      display: block;
      margin-top: 2px;
      font-size: 9px;
      font-weight: 700;
      letter-spacing: .04em;
      text-transform: uppercase;
    }

    body:not(.account-page) .module-wrap .row-badge.free {
      padding: 0 5px;
      font-size: 10px;
      line-height: 1.15;
      text-transform: uppercase;
    }

    body:not(.account-page) .badge.icon,
    body:not(.account-page) .row-badge.icon {
      background: #EEF6EF;
      color: var(--dc-forest);
      font-size: 22px;
    }

    body:not(.account-page) .badge.avatar,
    body:not(.account-page) .row-badge.avatar {
      border-radius: 999px;
      background: #F2F6F2;
      color: var(--dc-petrol);
    }

    body:not(.account-page) .badge.promo,
    body:not(.account-page) .row-badge.promo {
      background: #FCF0EA;
      color: var(--dc-terracotta);
      border-color: rgba(201,106,74,.22);
    }

    body:not(.account-page) .badge.gold,
    body:not(.account-page) .row-badge.free,
    body:not(.account-page) .code,
    body:not(.account-page) .code-pill {
      background: var(--gold-bg);
      color: #8E7130;
      border-color: var(--gold-line);
    }

    body:not(.account-page) .tag,
    body:not(.account-page) .count,
    body:not(.account-page) .sponsor-label,
    body:not(.account-page) .sponsor-badge,
    body:not(.account-page) .badge-soft,
    body:not(.account-page) .badge-success,
    body:not(.account-page) .badge-warning,
    body:not(.account-page) .badge-premium,
    body:not(.account-page) .badge-danger,
    body:not(.account-page) .badge-zone,
    body:not(.account-page) .badge-category {
      display: inline-flex;
      align-items: center;
      width: fit-content;
      min-height: 20px;
      padding: 3px 8px;
      border: 1px solid transparent;
      border-radius: 999px;
      font-size: 11px;
      font-weight: 700;
      line-height: 1.2;
      letter-spacing: 0;
      text-transform: none;
      white-space: nowrap;
    }

    body:not(.account-page) .tag,
    body:not(.account-page) .badge-soft {
      background: #F2F6F2;
      color: var(--ink-muted);
      border-color: #E5EEE8;
    }

    body:not(.account-page) .t-zone,
    body:not(.account-page) .badge-zone {
      background: #F4F7F3;
      color: #5D726B;
      border-color: #E5EEE8;
    }

    body:not(.account-page) .t-rubro,
    body:not(.account-page) .badge-category {
      background: #EEF6EF;
      color: var(--dc-forest);
      border-color: #D5E7DA;
    }

    body:not(.account-page) .t-green,
    body:not(.account-page) .badge-success {
      background: #EAF4ED;
      color: #2F6B57;
      border-color: #CFE2D4;
    }

    body:not(.account-page) .t-gold,
    body:not(.account-page) .sponsor-badge,
    body:not(.account-page) .badge-premium {
      background: var(--gold-bg);
      color: #8E7130;
      border-color: var(--gold-line);
    }

    body:not(.account-page) .t-red,
    body:not(.account-page) .badge-danger,
    body:not(.account-page) .badge-warning {
      background: #FCF0EA;
      color: #A84F3C;
      border-color: rgba(201,106,74,.20);
    }

    body:not(.account-page) .sponsor-label {
      background: #F2F6F2;
      color: #5D726B;
      border-color: #E5EEE8;
    }

    body:not(.account-page) .media-placeholder {
      background: #F4F7F3;
      border-color: var(--line);
      color: var(--ink-muted);
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 0;
    }

    body:not(.account-page) .side-pad {
      padding: 15px;
    }

    body:not(.account-page) .side-box h3 {
      font-size: 15px;
      line-height: 1.25;
      font-weight: 750;
      letter-spacing: 0;
    }

    body:not(.account-page) .side-row {
      border-top-color: var(--line-soft);
      color: var(--ink-muted);
      font-size: 12px;
    }

    body:not(.account-page) .side-row strong {
      color: var(--ink);
      font-size: 12.5px;
      font-weight: 700;
    }

    body:not(.account-page) .publish-box {
      background: linear-gradient(135deg, var(--dc-navy), var(--dc-petrol));
      color: #fff;
      border-color: transparent;
    }

    body:not(.account-page) .publish-box h3 {
      color: #fff;
    }

    body:not(.account-page) .publish-box p {
      color: rgba(255,255,255,.78);
    }

    body:not(.account-page) .sponsor-duo {
      width: min(1200px, calc(100% - 40px));
      margin-top: 12px;
      margin-bottom: 14px;
      gap: 12px;
      min-height: 138px;
    }

    body:not(.account-page) .sponsor-slot {
      width: min(980px, calc(100% - 40px));
      margin-top: 12px;
      margin-bottom: 14px;
      min-height: 138px;
    }

    body:not(.account-page) .sponsor-card {
      min-height: 116px;
      gap: 11px;
      padding: 10px;
      border-radius: 8px;
    }

    body:not(.account-page) .sponsor-card-image {
      border-radius: 6px;
      background: #F2F6F2;
    }

    body:not(.account-page) .sponsor-card h3 {
      color: var(--ink);
      font-size: 15px;
      line-height: 1.2;
      font-weight: 720;
    }

    body:not(.account-page) .sponsor-card p {
      color: var(--ink-muted);
      font-size: 12px;
      line-height: 1.35;
    }

    body:not(.account-page) .sponsor-cta {
      border-radius: 999px;
      background: var(--dc-forest);
      color: #fff;
      font-size: 12px;
      font-weight: 700;
    }

    body:not(.account-page) .sponsor-card-fallback .sponsor-card-body {
      row-gap: 4px;
    }

    body:not(.account-page) .sponsor-card-fallback .sponsor-cta-fallback {
      padding: 0;
      border-radius: 0;
      background: transparent;
      color: #0B4A45;
      box-shadow: none;
      font-size: 12px;
      font-weight: 800;
    }

    body:not(.account-page) footer {
      margin-top: 18px;
      padding: 16px 0;
      border-top-color: var(--line);
      background: rgba(250,251,248,.88);
    }

    body:not(.account-page) .footer-inner {
      align-items: center;
      gap: 12px;
    }

    body:not(.account-page) .footer-brand {
      font-size: 13px;
      font-weight: 750;
      letter-spacing: 0;
    }

    body:not(.account-page) .footer-legal,
    body:not(.account-page) .footer-links a,
    body:not(.account-page) .footer-link {
      color: var(--ink-muted);
      font-size: 11.5px;
      font-weight: 600;
    }

    body:not(.account-page) .kids-family-page,
    body.kids-family-page:not(.account-page) {
      background:
        radial-gradient(circle at 12% -12%, rgba(111,155,122,.10), transparent 28%),
        linear-gradient(180deg, var(--dc-warm-white) 0%, var(--dc-sand) 320px);
    }

    body:not(.account-page) .kids-controls {
      margin-top: 14px;
    }

    body:not(.account-page) .kids-filter-bar {
      gap: 7px;
      padding: 12px 16px 0;
    }

    body:not(.account-page) .kids-filter-chip {
      min-height: 32px;
      border-color: var(--line);
      padding: 0 12px;
      background: #FDFEFC;
      color: var(--ink-muted);
      font-size: 12px;
      font-weight: 700;
      box-shadow: none;
    }

    body:not(.account-page) .kids-filter-chip:hover {
      transform: translateY(-1px);
      border-color: var(--accent-line);
      background: #F5FAF6;
      color: var(--dc-forest);
      box-shadow: 0 1px 2px rgba(16,42,56,.04);
    }

    body:not(.account-page) .kids-filter-chip.on {
      border-color: var(--dc-forest);
      background: var(--dc-forest);
      color: #fff;
      box-shadow: 0 1px 2px rgba(47,107,87,.12);
    }

    body:not(.account-page) .kids-list {
      gap: 10px;
      padding: 12px;
    }

    body:not(.account-page) .kids-card {
      grid-template-columns: 52px minmax(0, 1fr) auto;
      gap: 12px;
      padding: 14px;
      border-radius: 8px;
    }

    body:not(.account-page) .kids-card-mark {
      width: 52px;
      height: 52px;
      font-weight: 800;
      letter-spacing: 0;
    }

    body:not(.account-page) .kids-card-kicker {
      color: var(--dc-forest);
      font-size: 10.5px;
      font-weight: 700;
      letter-spacing: .03em;
    }

    body:not(.account-page) .kids-secondary-panel {
      margin-top: 14px;
    }

    @media (max-width: 920px) {
      body:not(.account-page) .content-grid,
      body:not(.account-page) .kids-layout,
      body:not(.account-page) .kids-related-list {
        grid-template-columns: 1fr;
      }
    }

    @media (max-width: 760px) {
      body:not(.account-page) {
        font-size: 14px;
        line-height: 1.45;
      }

      body:not(.account-page) .w {
        padding-left: 12px;
        padding-right: 12px;
      }

      body:not(.account-page) .topbar .w {
        gap: 9px;
        padding-top: 9px;
        padding-bottom: 9px;
      }

      body:not(.account-page) .logo-mark {
        width: 32px;
        height: 32px;
      }

      body:not(.account-page) .logo-text {
        font-size: 15px !important;
      }

      body:not(.account-page) .btn {
        min-height: 34px;
        padding: 0 11px;
        font-size: 12px;
      }

      body:not(.account-page) .top-actions {
        margin-left: auto;
      }

      body:not(.account-page) .search-wrap {
        flex: 1 0 100%;
        max-width: none;
      }

      body:not(.account-page) .search-wrap input,
      body:not(.account-page) .filter-input,
      body:not(.account-page) .filter-select,
      body:not(.account-page) input,
      body:not(.account-page) select,
      body:not(.account-page) textarea {
        font-size: 16px;
      }

      body:not(.account-page) .zones .w {
        padding-left: 12px;
        padding-right: 12px;
      }

      body:not(.account-page) .zone-btn {
        padding: 9px 11px;
        font-size: 12px;
      }

      body:not(.account-page) .public-community-strip .w.tagline-inner,
      body:not(.account-page) .tagline-strip .w.tagline-inner {
        min-height: 50px !important;
        padding-top: 7px !important;
        padding-bottom: 7px !important;
      }

      body:not(.account-page) .tagline-main {
        max-width: 340px !important;
        font-size: 12.5px !important;
      }

      body:not(.account-page) .tagline-sub {
        max-width: 340px !important;
        font-size: 11px !important;
      }

      body:not(.account-page) .module-links,
      body:not(.account-page) .module-nav {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        border-radius: 8px !important;
      }

      body:not(.account-page) .module-nav {
        border-radius: 8px 8px 0 0 !important;
      }

      body:not(.account-page) .module-link,
      body:not(.account-page) .module-tab {
        min-height: 50px !important;
        padding: 9px 5px !important;
        align-items: center !important;
        justify-content: center !important;
        text-align: center !important;
      }

      body:not(.account-page) .module-link,
      body:not(.account-page) .module-tab strong {
        font-size: 11.5px !important;
        line-height: 1.1 !important;
      }

      body:not(.account-page) .module-link span,
      body:not(.account-page) .module-tab span {
        display: none !important;
      }

      body:not(.account-page) .page,
      body:not(.account-page) .module-wrap {
        padding-top: 10px !important;
      }

      body:not(.account-page) .hero-main {
        padding: 16px !important;
      }

      body:not(.account-page) .hero h1 {
        font-size: 24px !important;
        line-height: 1.12 !important;
      }

      body:not(.account-page) .hero p {
        font-size: 13px !important;
        line-height: 1.45 !important;
      }

      body:not(.account-page) .hero-actions {
        display: none !important;
      }

      body:not(.account-page) .hero-stats {
        grid-template-columns: 1fr !important;
      }

      body:not(.account-page) .stat {
        padding: 9px 13px !important;
        border-right: 0 !important;
        border-bottom: 1px solid var(--line-soft) !important;
      }

      body:not(.account-page) .stat:last-child {
        border-bottom: 0 !important;
      }

      body:not(.account-page) .stat strong {
        font-size: 15px !important;
      }

      body:not(.account-page) .stat span {
        font-size: 11px !important;
      }

      body:not(.account-page) .panel-head {
        padding: 13px 12px;
        align-items: flex-start;
      }

      body:not(.account-page) .panel-head h2,
      body:not(.account-page) .panel-title h1 {
        font-size: 18px;
      }

      body:not(.account-page) .filters {
        grid-template-columns: 1fr !important;
        padding: 11px 12px;
      }

      body:not(.account-page) .item,
      body:not(.account-page) .row-item {
        grid-template-columns: 50px minmax(0, 1fr);
        gap: 10px;
        padding: 13px 12px;
      }

      body:not(.account-page) .badge,
      body:not(.account-page) .row-badge,
      body:not(.account-page) .card-thumb {
        width: 50px !important;
        height: 44px !important;
        border-radius: 8px !important;
      }

      body:not(.account-page) .badge.avatar,
      body:not(.account-page) .row-badge.avatar {
        width: 42px !important;
        height: 42px !important;
      }

      body:not(.account-page) .item h3,
      body:not(.account-page) .row-info h3,
      body:not(.account-page) .compact-row strong,
      body:not(.account-page) .kids-card h3 {
        font-size: 14.5px;
      }

      body:not(.account-page) .actions,
      body:not(.account-page) .row-end,
      body:not(.account-page) .kids-card-actions {
        grid-column: 1 / -1;
        flex-direction: row;
        align-items: center;
        justify-content: flex-start;
        min-width: 0;
        flex-wrap: wrap;
        gap: 7px;
      }

      body:not(.account-page) .actions .btn,
      body:not(.account-page) .row-end .btn,
      body:not(.account-page) .kids-card-actions .btn {
        flex: 1;
        min-width: 122px;
      }

      body:not(.account-page) .compact-row {
        grid-template-columns: 1fr;
        padding: 12px;
      }

      body:not(.account-page) .kids-card,
      body:not(.account-page) .kids-card-compact {
        grid-template-columns: 50px minmax(0, 1fr);
        gap: 10px;
        padding: 12px;
      }

      body:not(.account-page) .kids-card-mark,
      body:not(.account-page) .kids-card-compact .kids-card-mark {
        width: 50px;
        height: 50px;
        border-radius: 8px;
      }

      body:not(.account-page) .sponsor-duo,
      body:not(.account-page) .sponsor-slot {
        width: min(100% - 16px, 430px);
      }

      body:not(.account-page) .sponsor-card {
        grid-template-columns: 96px minmax(0, 1fr);
        gap: 9px;
        min-height: 88px;
        padding: 8px;
      }

      body:not(.account-page) .sponsor-card h3 {
        font-size: 13px;
        line-height: 1.18;
      }

      body:not(.account-page) .sponsor-card p {
        font-size: 11.5px;
        line-height: 1.28;
        -webkit-line-clamp: 2;
      }

      body:not(.account-page) .sponsor-fallback-visual span {
        width: 28px;
        height: 28px;
        font-size: 11px;
      }

      body:not(.account-page) .sponsor-fallback-visual strong {
        font-size: 10.5px;
      }

      body:not(.account-page) .footer-inner {
        flex-direction: column;
        align-items: flex-start;
      }
    }

    @media (max-width: 380px) {
      body:not(.account-page) .module-link,
      body:not(.account-page) .module-tab strong {
        font-size: 10.5px !important;
      }

      body:not(.account-page) .sponsor-card {
        grid-template-columns: 1fr;
      }
    }

    @media (prefers-reduced-motion: reduce) {
      body:not(.account-page) *,
      body:not(.account-page) *::before,
      body:not(.account-page) *::after {
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
      }

      body:not(.account-page) .btn:hover,
      body:not(.account-page) .item:hover,
      body:not(.account-page) .row-item:hover,
      body:not(.account-page) .compact-row:hover,
      body:not(.account-page) .kids-card:hover,
      body:not(.account-page) .side-box:hover,
      body:not(.account-page) .sponsor-card:hover,
      body:not(.account-page) .module-link:hover,
      body:not(.account-page) .module-tab:hover {
        transform: none !important;
      }
    }

    /* Global sober finish: public and account surfaces */
    body:not(.account-page) {
      --bg: #F6F1E8;
      --card: #FAFBF8;
      --card-hover: #F7FAF6;
      --ink: #102A38;
      --ink-2: #1F3434;
      --ink-muted: #60736E;
      --ink-light: #7B8A84;
      --line: #E1E9E5;
      --line-soft: #ECF1EE;
      --accent: #063047;
      --accent-2: #0B4A45;
      --accent-bg: #EEF6EF;
      --accent-line: #CDDCD4;
      --gold-bg: #F7F1DD;
      --gold-line: #E5D7A9;
      --shadow: 0 1px 2px rgba(16,42,56,.035);
      --shadow-lift: 0 1px 2px rgba(16,42,56,.055);
      background: var(--bg) !important;
      color: var(--ink-2);
    }

    body:not(.account-page) .topbar {
      background: #FFFFFF !important;
      border-bottom: 1px solid #E1E9E5;
      box-shadow: none;
      backdrop-filter: none;
      -webkit-backdrop-filter: none;
    }

    .account-page .topbar {
      background: rgba(250,251,248,.96);
      border-bottom: 1px solid #E1E9E5;
      box-shadow: none;
    }

    body:not(.account-page) .logo-mark,
    .account-page .logo-mark {
      background: #063047;
      box-shadow: none;
    }

    body:not(.account-page) .public-community-strip,
    body:not(.account-page) .tagline-strip {
      margin-bottom: 0 !important;
      background: #FAFBF8 !important;
      border-top: 1px solid #E7EEE9 !important;
      border-bottom: 1px solid #E1E9E5 !important;
      box-shadow: none !important;
    }

    body:not(.account-page) .public-community-strip .w.tagline-inner,
    body:not(.account-page) .tagline-strip .w.tagline-inner {
      min-height: 54px !important;
      gap: 3px !important;
      padding-top: 9px !important;
      padding-bottom: 9px !important;
    }

    body:not(.account-page) .tagline-main {
      color: #063047 !important;
      font-size: 14px !important;
      font-weight: 760 !important;
      line-height: 1.2 !important;
    }

    body:not(.account-page) .tagline-sub {
      color: #526A63 !important;
      font-size: 12.5px !important;
      font-weight: 560 !important;
      line-height: 1.3 !important;
    }

    body:not(.account-page) .zones {
      background: #FAFBF8;
      border-bottom: 1px solid #E1E9E5;
    }

    body:not(.account-page) .zone-btn {
      border-radius: 0;
      transition: background .14s ease, color .14s ease, box-shadow .14s ease;
    }

    body:not(.account-page) .zone-btn:hover,
    body:not(.account-page) .zone-btn:focus-visible {
      background: #EEF6EF;
      color: #0B4A45;
      box-shadow: inset 0 -1px 0 #BFD4C8;
      outline: none;
    }

    body:not(.account-page) .zone-btn.on:hover,
    body:not(.account-page) .zone-btn.on:focus-visible {
      color: #0B4A45;
      box-shadow: inset 0 -1px 0 #BFD4C8;
    }

    body:not(.account-page) .module-strip,
    body:not(.account-page) .module-wrap {
      padding-top: 12px;
    }

    body:not(.account-page) .module-links,
    body:not(.account-page) .module-nav {
      background: #FAFBF8;
      border: 1px solid #DDE8E2;
      border-radius: 8px;
      box-shadow: none;
    }

    body:not(.account-page) .module-link,
    body:not(.account-page) .module-tab {
      border-color: #E7EEE9;
      color: #45645C;
      background: #FAFBF8;
      transition: background .14s ease, color .14s ease, border-color .14s ease;
    }

    body:not(.account-page) .module-link:hover,
    body:not(.account-page) .module-tab:hover {
      transform: none;
      background: #F4F8F4;
      color: #0B4A45;
      box-shadow: none;
    }

    body:not(.account-page) .module-link.on,
    body:not(.account-page) .module-tab.on {
      background: #EEF6EF;
      color: #063047;
      font-weight: 780;
      box-shadow: inset 0 -3px 0 #0B4A45;
    }

    body:not(.account-page) .module-link.on span,
    body:not(.account-page) .module-tab.on span {
      color: #31594F;
    }

    body:not(.account-page) .hero,
    body:not(.account-page) .public-module-hero,
    body:not(.account-page) .panel,
    body:not(.account-page) .main-panel,
    body:not(.account-page) .side-box,
    body:not(.account-page) .sponsor-card,
    body:not(.account-page) .kids-card,
    .account-page .account-card,
    .account-page .account-card-inner,
    .account-page .account-analysis-card,
    .account-page .account-plan-card,
    .account-page .account-payment-proof-card,
    .account-page .sponsor-card {
      background: #FAFBF8;
      border: 1px solid #DDE8E2;
      border-radius: 8px;
      box-shadow: none;
    }

    body:not(.account-page) .hero-main,
    body:not(.account-page) .panel-head,
    body:not(.account-page) .module-helper,
    body:not(.account-page) .filters,
    body:not(.account-page) .hero-stats,
    .account-page .account-card-head,
    .account-page .account-card-inner,
    .account-page .account-form-footer {
      background: #FAFBF8;
      border-color: #E7EEE9;
    }

    body:not(.account-page) .item,
    body:not(.account-page) .row-item,
    body:not(.account-page) .compact-row,
    body:not(.account-page) .kids-card {
      background: #FAFBF8;
      border-color: #E7EEE9;
      box-shadow: none;
    }

    body:not(.account-page) .item:hover,
    body:not(.account-page) .row-item:hover,
    body:not(.account-page) .compact-row:hover,
    body:not(.account-page) .kids-card:hover,
    body:not(.account-page) .side-box:hover,
    body:not(.account-page) .sponsor-card:hover,
    .account-page .account-card:hover,
    .account-page .account-card-inner:hover,
    .account-page .account-analysis-card:hover,
    .account-page .account-plan-card:hover {
      transform: none;
      background: #FDFEFC;
      border-color: #D2E1DA;
      box-shadow: none;
    }

    body:not(.account-page) .publish-box,
    body:not(.account-page) .kids-side .publish-box {
      background: #063047;
      border-color: #063047;
      color: #fff;
      box-shadow: none;
    }

    body:not(.account-page) .search-wrap input,
    body:not(.account-page) .filter-input,
    body:not(.account-page) .filter-select,
    .account-page input,
    .account-page select,
    .account-page textarea {
      background: #FFFFFF;
      border: 1px solid #DDE8E2;
      border-radius: 8px;
      box-shadow: none;
    }

    body:not(.account-page) .search-wrap input:focus,
    body:not(.account-page) .filter-input:focus,
    body:not(.account-page) .filter-select:focus,
    .account-page input:focus,
    .account-page select:focus,
    .account-page textarea:focus {
      border-color: #9FBCB0;
      box-shadow: 0 0 0 3px rgba(47,107,87,.10);
    }

    body:not(.account-page) .btn,
    .account-page .btn,
    .account-page .account-plan-card-btn,
    .account-page .account-plan-card-action {
      border-radius: 999px;
      box-shadow: none;
      transition: transform .14s ease, background .14s ease, border-color .14s ease, color .14s ease, box-shadow .14s ease;
    }

    body:not(.account-page) .btn:hover {
      transform: translateY(-1px);
      box-shadow: 0 2px 6px rgba(6,48,71,.08);
    }

    .account-page .btn:hover,
    .account-page .account-plan-card-btn:hover {
      transform: none;
      box-shadow: none;
    }

    body:not(.account-page) .btn-accent,
    .account-page .btn-accent,
    .account-page .btn-primary {
      background: #0B4A45;
      border-color: #0B4A45;
      color: #fff;
    }

    body:not(.account-page) .btn-accent:hover,
    .account-page .btn-accent:hover,
    .account-page .btn-primary:hover {
      background: #063047;
      border-color: #063047;
    }

    body:not(.account-page) .btn-soft,
    body:not(.account-page) .btn-ghost,
    body:not(.account-page) .view-all,
    .account-page .btn-soft,
    .account-page .btn-ghost {
      background: #FFFFFF;
      border: 1px solid #CFE0D6;
      color: #0B4A45;
    }

    body:not(.account-page) .btn-soft:hover,
    body:not(.account-page) .btn-ghost:hover,
    body:not(.account-page) .view-all:hover,
    .account-page .btn-soft:hover,
    .account-page .btn-ghost:hover {
      background: #EEF6EF;
      border-color: #9FBCB0;
      color: #063047;
    }

    body:not(.account-page) .tag,
    body:not(.account-page) .count,
    body:not(.account-page) .sponsor-label,
    body:not(.account-page) .sponsor-badge,
    .account-page .account-pill,
    .account-page .account-data-badge,
    .account-page .account-status {
      border-radius: 999px;
      font-weight: 700;
      letter-spacing: 0;
      text-transform: none;
    }

    body:not(.account-page) .t-zone,
    body:not(.account-page) .badge-zone {
      background: #F3F6F3;
      border-color: #E2EAE5;
      color: #526A63;
    }

    body:not(.account-page) .t-rubro,
    body:not(.account-page) .badge-category {
      background: #EEF6EF;
      border-color: #D6E6DC;
      color: #255B49;
    }

    body:not(.account-page) .t-gold,
    body:not(.account-page) .t-green,
    body:not(.account-page) .t-red,
    body:not(.account-page) .sponsor-badge,
    body:not(.account-page) .badge-success,
    body:not(.account-page) .badge-warning,
    body:not(.account-page) .badge-premium,
    body:not(.account-page) .badge-danger,
    body:not(.account-page) .code,
    body:not(.account-page) .code-pill {
      background: #F7F1DD;
      border-color: #E5D7A9;
      color: #715B20;
    }

    body:not(.account-page) .badge,
    body:not(.account-page) .row-badge,
    body:not(.account-page) .card-thumb,
    body:not(.account-page) .kids-card-mark,
    body:not(.account-page) .media-placeholder {
      background: #F3F6F3;
      border-color: #DDE8E2;
      color: #0B4A45;
      box-shadow: none;
    }

    body:not(.account-page) .badge.promo,
    body:not(.account-page) .row-badge.promo {
      background: #F7F1DD;
      border-color: #E5D7A9;
      color: #715B20;
    }

    body:not(.account-page) .sponsor-duo {
      width: min(1200px, calc(100% - 40px));
      margin-top: 12px;
      margin-bottom: 14px;
      gap: 12px;
      min-height: 138px;
    }

    body:not(.account-page) .sponsor-slot {
      width: min(980px, calc(100% - 40px));
      margin-top: 12px;
      margin-bottom: 14px;
      min-height: 138px;
    }

    body:not(.account-page) .sponsor-card-image {
      background: #F3F6F3;
    }

    body:not(.account-page) .sponsor-card-fallback .sponsor-cta-fallback {
      padding: 0;
      border: 0;
      border-radius: 0;
      background: transparent;
      color: #0B4A45;
      box-shadow: none;
      text-decoration: none;
    }

    body:not(.account-page) .sponsor-card-fallback .sponsor-cta-fallback:hover {
      background: transparent;
      color: #063047;
      text-decoration: underline;
      box-shadow: none;
    }

    body:not(.account-page) footer,
    .account-page .account-footer {
      background: #FAFBF8;
      border-top: 1px solid #E1E9E5;
      box-shadow: none;
    }

    body.kids-family-page:not(.account-page),
    .account-page {
      background: #F6F1E8;
    }

    .account-page .account-shell {
      background: #F6F1E8;
    }

    .account-page .account-hero {
      background: #063047;
      border: 1px solid #063047;
      border-radius: 8px;
      box-shadow: none;
    }

    .account-page .account-hero p,
    .account-page .account-hero .crumb {
      color: rgba(255,255,255,.76);
    }

    .account-page .account-back-link {
      background: #FFFFFF;
      border-color: #DDE8E2;
      box-shadow: none;
    }

    .account-page .account-sidebar-card {
      background: #063047;
      border: 1px solid #063047;
      border-radius: 8px;
      box-shadow: none;
      padding: 14px;
    }

    .account-page .account-sidebar-card strong {
      margin-top: 4px;
      font-size: 15px;
    }

    .account-page .account-sidebar-card p {
      margin-top: 3px;
      font-size: 11.5px;
    }

    .account-page .account-hero .account-context-card {
      width: min(420px, 100%);
      padding: 12px;
      justify-self: end;
      gap: 10px;
      grid-template-columns: 1fr;
      background: #FAFBF8;
      border: 1px solid rgba(255,255,255,.72);
      border-radius: 8px;
      box-shadow: none;
    }

    .account-page .account-hero .account-context-card h2 {
      margin: 2px 0 2px;
      color: #063047;
      font-size: 17px;
      line-height: 1.18;
      font-weight: 760;
    }

    .account-page .account-hero .account-context-card p,
    .account-page .account-hero .account-context-card .eyebrow {
      color: #526A63;
    }

    .account-page .account-hero .account-context-card .eyebrow {
      margin-bottom: 2px;
      font-size: 10px;
    }

    .account-page .account-hero .account-context-card #account-context-copy {
      font-size: 12px;
      line-height: 1.35;
    }

    .account-page .account-hero .account-context-card #account-context-copy[hidden] {
      display: none !important;
    }

    .account-page .account-hero .account-context-actions {
      width: 100%;
      justify-content: stretch;
    }

    .account-page .account-hero .account-context-button {
      flex: 1 1 0;
      min-height: 32px;
      padding: 6px 10px;
      font-size: 12px;
    }

    .account-page .account-hero .account-context-button:disabled,
    .account-page .account-hero .account-context-button.is-disabled {
      cursor: not-allowed;
      opacity: .48;
      background: transparent;
      border-color: transparent;
      color: #526A63;
    }

    .account-page .account-section-nav,
    .account-page .account-mobile-section-control,
    .account-page .account-context-card,
    .account-page .account-toolbar,
    .account-page .account-auth-panel,
    .account-page .account-demo-switch,
    .account-page .account-state,
    .account-page .account-accordion,
    .account-page .account-dashboard {
      background: #FAFBF8;
      border: 1px solid #DDE8E2;
      border-radius: 8px;
      box-shadow: none;
    }

    .account-page .account-section-nav {
      padding: 10px;
      gap: 7px;
    }

    .account-page .account-nav-item {
      min-height: 42px;
      border-radius: 8px;
      border-color: #E1E9E5;
      background: #FFFFFF;
      box-shadow: none;
      font-weight: 720;
      transition: background .14s ease, border-color .14s ease, color .14s ease;
    }

    .account-page .account-nav-item:hover {
      transform: none;
      background: #F4F8F4;
      border-color: #CFE0D6;
      box-shadow: none;
    }

    .account-page .account-nav-item.is-active {
      background: #0B4A45;
      border-color: #0B4A45;
      box-shadow: none;
      font-weight: 760;
    }

    .account-page .account-context-actions,
    .account-page .account-segmented {
      border-color: #DDE8E2;
      background: #F3F7F1;
      box-shadow: none;
    }

    .account-page .account-context-button,
    .account-page .account-segmented-option {
      font-weight: 720;
    }

    .account-page .account-context-button.is-active,
    .account-page .account-segmented-option.is-active {
      background: #0B4A45;
      border-color: #0B4A45;
      box-shadow: none;
    }

    .account-page .account-card h2,
    .account-page .account-toolbar h2,
    .account-page .account-auth-panel h2,
    .account-page .account-context-card h2,
    .account-page .account-analytics-header h2 {
      font-weight: 760;
      letter-spacing: 0;
    }

    .account-page .eyebrow,
    .account-page .account-toolbar-kicker,
    .account-page .account-sidebar-kicker,
    .account-page .account-nav-group,
    .account-page .account-mobile-section-control label {
      font-weight: 700;
      letter-spacing: .045em;
    }

    .account-page .account-metric,
    .account-page .account-kpi-item,
    .account-page .account-classified,
    .account-page .account-media-item,
    .account-page .account-analysis-card,
    .account-page .account-analytics-header,
    .account-page .account-classifieds-section,
    .account-page .account-classified-form-section,
    .account-page .account-commercial-summary,
    .account-page .account-commercial-note {
      background: #FAFBF8;
      border: 1px solid #DDE8E2;
      border-radius: 8px;
      box-shadow: none;
    }

    .account-page .account-metric,
    .account-page .account-kpi-item {
      min-height: 132px;
      border-left-color: #CFE0D6;
    }

    .account-page .account-metric::after,
    .account-page .account-kpi-item::after,
    .account-page .account-dashboard::before {
      display: none;
    }

    .account-page .account-metric strong,
    .account-page .account-kpi-value,
    .account-page .account-analysis-kv dd {
      font-weight: 760;
      letter-spacing: 0;
    }

    .account-page .account-form label,
    .account-page .account-auth-form label,
    .account-page .account-zones-field,
    .account-page .account-fieldset,
    .account-page .account-check {
      font-weight: 700;
    }

    .account-page .account-check {
      border-radius: 8px;
      background: #FFFFFF;
      border-color: #DDE8E2;
    }

    .account-page .account-check:has(input:checked) {
      background: #EEF6EF;
      border-color: #CFE0D6;
    }

    @media (max-width: 760px) {
      body:not(.account-page) .public-community-strip .w.tagline-inner,
      body:not(.account-page) .tagline-strip .w.tagline-inner {
        min-height: auto !important;
        padding-top: 10px !important;
        padding-bottom: 10px !important;
      }

      body:not(.account-page) .tagline-main {
        font-size: 12.8px !important;
      }

      body:not(.account-page) .tagline-sub {
        font-size: 11.5px !important;
      }

      body:not(.account-page) .module-wrap .main-panel {
        margin-top: 12px;
      }

      body:not(.account-page) .module-wrap .row-item,
      body:not(.account-page) .item {
        padding: 14px 12px;
      }

      body:not(.account-page) .module-wrap .row-end,
      body:not(.account-page) .actions,
      body:not(.account-page) .kids-card-actions {
        margin-top: 2px;
      }

      .account-page .account-hero .account-context-card {
        width: 100%;
        justify-self: stretch;
        padding: 11px;
      }
    }

    /* Public lateral CTA finish */
    html {
      scroll-padding-top: 88px;
    }

    body:not(.account-page) .page,
    body:not(.account-page) .hero,
    body:not(.account-page) .panel,
    body:not(.account-page) .sponsor-slot,
    body:not(.account-page) .module-strip {
      scroll-margin-top: 88px;
    }

    body:not(.account-page) .side {
      align-content: start;
    }

    body:not(.account-page) .side-box.publish-box,
    body:not(.account-page) .kids-side .side-box.publish-box {
      background: #063047 !important;
      border-color: #063047 !important;
      color: #FFFFFF !important;
      box-shadow: none !important;
    }

    body:not(.account-page) .side-box.publish-box:hover,
    body:not(.account-page) .kids-side .side-box.publish-box:hover {
      background: #0B4A45 !important;
      border-color: #2F6B57 !important;
      color: #FFFFFF !important;
      transform: translateY(-1px);
      box-shadow: 0 1px 2px rgba(16,42,56,.08) !important;
    }

    body:not(.account-page) .side-box.publish-box h3,
    body:not(.account-page) .side-box.publish-box p,
    body:not(.account-page) .kids-side .side-box.publish-box h3,
    body:not(.account-page) .kids-side .side-box.publish-box p {
      color: #FFFFFF !important;
    }

    body:not(.account-page) .side-box.publish-box p,
    body:not(.account-page) .kids-side .side-box.publish-box p {
      opacity: .82;
    }

    body:not(.account-page) .side-box.publish-box .btn,
    body:not(.account-page) .kids-side .side-box.publish-box .btn {
      background: #FAFBF8 !important;
      border-color: rgba(255,255,255,.70) !important;
      color: #063047 !important;
      box-shadow: none !important;
    }

    body:not(.account-page) .side-box.publish-box .btn:hover,
    body:not(.account-page) .kids-side .side-box.publish-box .btn:hover {
      background: #EEF6EF !important;
      border-color: #FFFFFF !important;
      color: #063047 !important;
      transform: none;
      box-shadow: none !important;
    }

    @media (max-width: 760px) {
      html {
        scroll-padding-top: 104px;
      }

      body:not(.account-page) .page,
      body:not(.account-page) .hero,
      body:not(.account-page) .panel,
      body:not(.account-page) .sponsor-slot,
      body:not(.account-page) .module-strip {
        scroll-margin-top: 104px;
      }
    }

    /* Public module hero CTA layout */
    body:not(.account-page) .content-grid {
      grid-template-columns: minmax(0, 1fr) !important;
    }

    body:not(.account-page) .hero-main {
      grid-template-columns: minmax(0, 1fr) minmax(260px, 320px) !important;
      align-items: stretch !important;
      gap: 18px !important;
    }

    body:not(.account-page) .hero-main > div:first-child {
      align-self: center;
    }

    body:not(.account-page) .hero-cta-card {
      display: grid;
      align-content: center;
      gap: 9px;
      min-height: 138px;
      border: 1px solid #063047;
      border-radius: 8px;
      padding: 16px;
      background: #063047;
      color: #FFFFFF;
      box-shadow: none;
      transition: background .14s ease, border-color .14s ease, transform .14s ease, box-shadow .14s ease;
    }

    body:not(.account-page) .hero-cta-card:hover {
      background: #0B4A45;
      border-color: #2F6B57;
      transform: translateY(-1px);
      box-shadow: 0 1px 2px rgba(16,42,56,.08);
    }

    body:not(.account-page) .hero-cta-card h2 {
      color: #FFFFFF;
      font-size: 16px;
      line-height: 1.18;
      font-weight: 780;
      letter-spacing: 0;
    }

    body:not(.account-page) .hero-cta-card p {
      margin: 0;
      color: rgba(255,255,255,.82);
      font-size: 12.5px;
      line-height: 1.4;
    }

    body:not(.account-page) .hero-cta-card .btn {
      width: 100%;
      margin-top: 3px;
      background: #FAFBF8;
      border-color: rgba(255,255,255,.70);
      color: #063047;
      box-shadow: none;
    }

    body:not(.account-page) .hero-cta-card .btn:hover {
      background: #EEF6EF;
      border-color: #FFFFFF;
      color: #063047;
      transform: none;
      box-shadow: none;
    }

    @media (max-width: 920px) {
      body:not(.account-page) .hero-main {
        grid-template-columns: 1fr !important;
      }

      body:not(.account-page) .hero-cta-card {
        width: 100%;
        min-height: 0;
      }
    }

    /* Public module hero compact rhythm */
    body:not(.account-page) .public-module-hero .hero-main {
      padding: 16px 18px 14px !important;
      grid-template-columns: minmax(0, 1fr) minmax(236px, 292px) !important;
      gap: 16px !important;
    }

    body:not(.account-page) .public-module-hero h1 {
      font-size: 26px !important;
      line-height: 1.06 !important;
    }

    body:not(.account-page) .public-module-hero .hero-main > div:first-child > p {
      max-width: 620px;
      margin-top: 4px;
      font-size: 13px !important;
      line-height: 1.35 !important;
    }

    body:not(.account-page) .hero-cta-card {
      min-height: 0;
      gap: 7px;
      padding: 13px 14px;
    }

    body:not(.account-page) .hero-cta-card h2 {
      font-size: 14.5px;
      line-height: 1.15;
    }

    body:not(.account-page) .hero-cta-card p {
      font-size: 11.5px;
      line-height: 1.32;
    }

    body:not(.account-page) .hero-cta-card .btn {
      min-height: 32px;
      margin-top: 1px;
      font-size: 12px;
    }

    body:not(.account-page) .public-module-hero .hero-stats {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      align-items: stretch;
      gap: 0;
      background: #F7FAF8;
    }

    body:not(.account-page) .public-module-hero .stat {
      min-width: 0;
      padding: 8px 16px;
      border-right: 1px solid #E7EEE9;
    }

    body:not(.account-page) .public-module-hero .stat:last-child {
      border-right: 0;
    }

    body:not(.account-page) .public-module-hero .stat strong {
      font-size: 14px;
      line-height: 1.15;
    }

    body:not(.account-page) .public-module-hero .stat span {
      font-size: 10.5px;
      line-height: 1.2;
    }

    @media (max-width: 920px) {
      body:not(.account-page) .public-module-hero .hero-main {
        grid-template-columns: 1fr !important;
      }
    }

    @media (max-width: 680px) {
      body:not(.account-page) .public-module-hero .hero-main {
        padding: 14px 12px 12px !important;
        gap: 11px !important;
      }

      body:not(.account-page) .public-module-hero h1 {
        font-size: 22px !important;
      }

      body:not(.account-page) .public-module-hero .hero-stats {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
      }

      body:not(.account-page) .public-module-hero .stat {
        padding: 8px 9px !important;
        border-right: 1px solid #E7EEE9 !important;
        border-bottom: 0 !important;
      }

      body:not(.account-page) .public-module-hero .stat:last-child {
        border-right: 0 !important;
      }

      body:not(.account-page) .public-module-hero .stat strong {
        font-size: 12.5px !important;
      }

      body:not(.account-page) .public-module-hero .stat span {
        font-size: 9.5px !important;
      }
    }

    /* Public home gateway */
    body:not(.account-page) .home-gateway .main-panel[hidden] {
      display: none !important;
    }

    body:not(.account-page) .home-free-card {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      align-items: center;
      gap: 18px;
      margin-top: 14px;
      padding: 22px;
      border: 1px solid #DDE8E2;
      border-radius: 10px;
      background: #FFFFFF;
      box-shadow: none;
    }

    body:not(.account-page) .home-free-kicker {
      margin: 0 0 7px;
      color: #0B4A45;
      font-size: 11px;
      font-weight: 780;
      letter-spacing: .04em;
      text-transform: uppercase;
    }

    body:not(.account-page) .home-free-card h1 {
      margin: 0;
      max-width: 760px;
      color: #063047;
      font-size: 24px;
      line-height: 1.16;
      font-weight: 780;
      letter-spacing: 0;
    }

    body:not(.account-page) .home-free-highlight {
      color: #16A34A;
      font: inherit;
      font-weight: 860;
      white-space: nowrap;
    }

    body:not(.account-page) .home-free-card p:not(.home-free-kicker) {
      margin: 7px 0 0;
      max-width: 680px;
      color: #526A63;
      font-size: 14px;
      line-height: 1.45;
      font-weight: 450;
    }

    body:not(.account-page) .home-free-commercial {
      max-width: 720px;
      margin-top: 14px;
      padding-top: 13px;
      border-top: 1px solid #E1E9E5;
    }

    body:not(.account-page) .home-free-commercial .home-free-kicker {
      margin-bottom: 5px;
    }

    body:not(.account-page) .home-free-commercial p:not(.home-free-kicker) {
      margin-top: 0;
      font-size: 13px;
      line-height: 1.45;
    }

    body:not(.account-page) .home-free-actions {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      gap: 10px;
      flex-wrap: wrap;
    }

    @media (max-width: 760px) {
      body:not(.account-page) .home-free-card {
        grid-template-columns: 1fr;
        gap: 14px;
        margin-top: 12px;
        padding: 18px 16px;
      }

      body:not(.account-page) .home-free-card h1 {
        font-size: 22px;
      }

      body:not(.account-page) .home-free-highlight {
        white-space: normal;
      }

      body:not(.account-page) .home-free-actions {
        justify-content: stretch;
      }

      body:not(.account-page) .home-free-actions .btn {
        width: 100%;
        justify-content: center;
      }
    }

    /* Public WhatsApp CTA */
    body:not(.account-page) .btn-wa {
      background: #25D366;
      border-color: #1EBE5D;
      color: #053B1D;
      font-weight: 850;
      box-shadow: 0 1px 2px rgba(37, 211, 102, .22);
    }

    body:not(.account-page) .btn-wa:hover,
    body:not(.account-page) .btn-wa:focus-visible {
      background: #1DB954;
      border-color: #159947;
      color: #032D16;
      box-shadow: 0 2px 5px rgba(37, 211, 102, .24);
      outline: none;
    }

    /* Public global search */
    body:not(.account-page) .search-wrap.global-search-ready {
      position: relative;
      z-index: 120;
    }

    body:not(.account-page) .global-search-panel {
      position: absolute;
      top: calc(100% + 8px);
      left: 0;
      right: 0;
      display: grid;
      gap: 8px;
      max-height: min(68vh, 520px);
      padding: 10px;
      overflow-y: auto;
      border: 1px solid #DDE8E2;
      border-radius: 10px;
      background: #FFFFFF;
      box-shadow: 0 14px 36px rgba(16, 42, 56, .12);
    }

    body:not(.account-page) .global-search-panel[hidden] {
      display: none !important;
    }

    body:not(.account-page) .global-search-head {
      padding: 4px 6px 2px;
      color: #607575;
      font-size: 11px;
      font-weight: 760;
      letter-spacing: .04em;
      text-transform: uppercase;
    }

    body:not(.account-page) .global-search-section {
      display: grid;
      gap: 4px;
      padding-top: 4px;
      border-top: 1px solid #EEF3EF;
    }

    body:not(.account-page) .global-search-section h3 {
      margin: 0;
      padding: 2px 6px;
      color: #0B4A45;
      font-size: 12px;
      font-weight: 780;
    }

    body:not(.account-page) .global-search-result,
    body:not(.account-page) .global-search-all {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      padding: 9px 10px;
      border: 1px solid transparent;
      border-radius: 8px;
      color: #102A38;
      text-decoration: none;
      transition: background .14s ease, border-color .14s ease;
    }

    body:not(.account-page) .global-search-result:hover,
    body:not(.account-page) .global-search-result:focus-visible,
    body:not(.account-page) .global-search-result.is-active,
    body:not(.account-page) .global-search-all:hover,
    body:not(.account-page) .global-search-all:focus-visible {
      background: #F5FBF8;
      border-color: #D6E6DC;
      outline: none;
    }

    body:not(.account-page) .global-search-result-main {
      display: grid;
      min-width: 0;
      gap: 2px;
    }

    body:not(.account-page) .global-search-result-main strong {
      overflow: hidden;
      color: #063047;
      font-size: 13px;
      font-weight: 760;
      line-height: 1.24;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    body:not(.account-page) .global-search-result-main small {
      overflow: hidden;
      color: #607575;
      font-size: 11px;
      line-height: 1.25;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    body:not(.account-page) .global-search-module {
      flex: 0 0 auto;
      padding: 4px 7px;
      border-radius: 999px;
      background: #EEF6EF;
      color: #255B49;
      font-size: 10.5px;
      font-weight: 760;
    }

    body:not(.account-page) .global-search-all {
      justify-content: center;
      margin-top: 2px;
      border-color: #DDE8E2;
      color: #0B4A45;
      font-size: 12px;
      font-weight: 780;
    }

    body:not(.account-page) .global-search-empty {
      display: grid;
      gap: 3px;
      padding: 12px;
      color: #607575;
      font-size: 12px;
      line-height: 1.35;
    }

    body:not(.account-page) .global-search-empty strong {
      color: #063047;
      font-size: 13px;
    }

    @media (max-width: 760px) {
      body:not(.account-page) .search-wrap.global-search-ready {
        z-index: 140;
      }

      body:not(.account-page) .global-search-panel {
        top: calc(100% + 6px);
        max-height: 58vh;
        padding: 8px;
        border-radius: 8px;
      }

      body:not(.account-page) .global-search-result {
        align-items: flex-start;
      }

      body:not(.account-page) .global-search-module {
        display: none;
      }
    }

    @media (min-width: 761px) {
      body:not(.account-page) .module-link,
      body:not(.account-page) .module-tab {
        display: grid !important;
        grid-template-rows: 18px 30px;
        align-content: center !important;
        align-items: start !important;
        justify-content: stretch !important;
        min-height: 76px !important;
        padding: 12px 14px 11px !important;
        line-height: 1.15 !important;
      }

      body:not(.account-page) .module-tab strong {
        display: block;
        min-height: 18px;
        line-height: 1.15 !important;
      }

      body:not(.account-page) .module-link span,
      body:not(.account-page) .module-tab span {
        display: block;
        margin-top: 0 !important;
        max-width: 100%;
        line-height: 1.16 !important;
      }

      body:not(.account-page) .module-link.on,
      body:not(.account-page) .module-tab.on {
        font-weight: 750;
      }
    }

    /* Access page */
    body.access-page {
      min-height: 100vh;
      display: flex;
      flex-direction: column;
      background: #F6F1E8;
      color: #102A38;
    }

    .access-topbar {
      background: #FFFFFF;
      border-bottom: 1px solid #DDE8E2;
    }

    .access-topbar-inner {
      min-height: 56px;
      display: flex;
      align-items: center;
      gap: 8px;
    }

    .access-back {
      width: 34px;
      height: 34px;
      border-radius: 999px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      border: 1px solid transparent;
      color: #063047;
      transition: background .12s ease, border-color .12s ease, transform .12s ease;
    }

    .access-back:hover {
      background: #F7FAF8;
      border-color: #DDE8E2;
      transform: translateX(-1px);
    }

    .access-back svg {
      width: 18px;
      height: 18px;
      display: block;
    }

    .access-main {
      width: 100%;
      max-width: 500px;
      margin: 0 auto;
      padding: 14px 20px 8px;
      flex: 1;
    }

    .access-card {
      background: #FFFFFF;
      border: 1px solid #DDE8E2;
      border-radius: 14px;
      box-shadow: 0 1px 2px rgba(0,0,0,.04);
      padding: 18px 20px;
    }

    .access-copy {
      display: grid;
      gap: 4px;
      margin-bottom: 12px;
    }

    .access-copy h1 {
      color: #063047;
      font-family: var(--font-display);
      font-size: 25px;
      line-height: 1.08;
      font-weight: 820;
      letter-spacing: 0;
    }

    .access-copy p:not(.eyebrow) {
      color: #486263;
      font-size: 13.5px;
      line-height: 1.4;
    }

    .access-copy p:not(.eyebrow) strong {
      color: #13A75A;
      font-weight: 850;
    }

    .access-tabs {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      border: 1px solid #DDE8E2;
      border-radius: 999px;
      padding: 4px;
      background: #F7FAF8;
      margin-bottom: 10px;
    }

    .access-tab {
      min-height: 34px;
      border-radius: 999px;
      color: #486263;
      font-size: 13px;
      font-weight: 760;
    }

    .access-tab.is-active {
      background: #0B4A45;
      color: #FFFFFF;
      box-shadow: 0 1px 2px rgba(0,0,0,.04);
    }

    .access-google {
      width: 100%;
      min-height: 40px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 10px;
      border: 1px solid #DDE8E2;
      border-radius: 999px;
      background: #FFFFFF;
      color: #1F3434;
      font-size: 14px;
      font-weight: 780;
      transition: background .12s ease, border-color .12s ease, transform .12s ease;
    }

    .access-google:hover {
      background: #F7FAF8;
      border-color: #BFD1C9;
      transform: translateY(-1px);
    }

    .access-google-icon {
      width: 18px;
      height: 18px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      line-height: 1;
    }

    .access-google-icon svg {
      width: 18px;
      height: 18px;
      display: block;
    }

    .access-divider {
      display: flex;
      align-items: center;
      gap: 12px;
      margin: 10px 0;
      color: #607575;
      font-size: 12px;
      font-weight: 700;
    }

    .access-divider::before,
    .access-divider::after {
      content: "";
      height: 1px;
      flex: 1;
      background: #E3EBE8;
    }

    .access-mode {
      display: grid;
      gap: 8px;
    }

    .access-mode[hidden] {
      display: none;
    }

    .access-mode-copy {
      color: #607575;
      font-size: 12.5px;
      line-height: 1.4;
    }

    .access-field {
      display: grid;
      gap: 6px;
      color: #2F4A4A;
      font-size: 12px;
      font-weight: 760;
    }

    .access-field input {
      width: 100%;
      min-height: 38px;
      border: 1px solid #DDE8E2;
      border-radius: 10px;
      background: #FFFFFF;
      color: #102A38;
      padding: 0 12px;
      font-size: 14px;
      outline: none;
    }

    .access-field input:focus {
      border-color: #8DB8A1;
      box-shadow: 0 0 0 4px rgba(111,155,122,.16);
    }

    .auth-field-help {
      margin-top: -1px;
      color: #607575;
      font-size: 11.5px;
      line-height: 1.35;
      font-weight: 600;
    }

    .access-submit {
      min-height: 38px;
      margin-top: 2px;
      background: #0B4A45;
      border-color: #0B4A45;
    }

    .access-links {
      display: flex;
      justify-content: space-between;
      gap: 10px;
      flex-wrap: wrap;
      margin-top: 2px;
    }

    .access-links button {
      color: #0B4A45;
      font-size: 12.5px;
      font-weight: 780;
    }

    .access-message {
      margin-bottom: 10px;
      border: 1px solid #DDE8E2;
      border-radius: 10px;
      padding: 10px 12px;
      background: #F7FAF8;
      color: #2F4A4A;
      font-size: 12.5px;
      line-height: 1.35;
      font-weight: 650;
    }

    .access-message[data-tone="error"] {
      border-color: #F0C8BF;
      background: #FFF4F0;
      color: #9E3F27;
    }

    .access-message[data-tone="success"] {
      border-color: #BFE2CD;
      background: #F0FBF4;
      color: #0D5F2D;
    }

    body.access-page .footer {
      margin-top: 0;
      padding: 14px 0;
      box-shadow: none;
    }

    body.access-page .footer-inner {
      padding-top: 0;
      padding-bottom: 0;
    }

    body.access-page .footer nav {
      display: flex;
      gap: 14px;
      flex-wrap: wrap;
    }

    /* Legal and contact pages */
    body.legal-page {
      min-height: 100vh;
      display: flex;
      flex-direction: column;
      background: #F6F1E8;
      color: #102A38;
    }

    .legal-main {
      width: 100%;
      max-width: 920px;
      padding: 24px 20px 32px;
      flex: 1;
    }

    .legal-card {
      background: #FFFFFF;
      border: 1px solid #DDE8E2;
      border-radius: 14px;
      box-shadow: 0 1px 2px rgba(0,0,0,.04);
      padding: clamp(22px, 4vw, 34px);
    }

    .legal-card h1 {
      margin: 4px 0 18px;
      color: #063047;
      font-family: var(--font-display);
      font-size: clamp(27px, 4vw, 38px);
      line-height: 1.05;
      letter-spacing: 0;
      font-weight: 820;
    }

    .legal-content {
      display: grid;
      gap: 12px;
    }

    .legal-content h2 {
      margin-top: 14px;
      color: #063047;
      font-family: var(--font-display);
      font-size: 18px;
      line-height: 1.2;
      font-weight: 800;
      letter-spacing: 0;
    }

    .legal-content p,
    .legal-content li {
      color: #2F4A4A;
      font-size: 14px;
      line-height: 1.58;
    }

    .legal-content ul {
      display: grid;
      gap: 7px;
      padding-left: 20px;
    }

    .legal-detail {
      display: inline-flex;
      width: fit-content;
      max-width: 100%;
      border: 1px solid #DDE8E2;
      border-radius: 999px;
      background: #F7FAF8;
      padding: 8px 12px;
      color: #0B4A45 !important;
      font-weight: 760;
      overflow-wrap: anywhere;
    }

    .legal-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      align-items: center;
      margin: 4px 0 2px;
    }

    .legal-muted-action {
      min-height: 36px;
      display: inline-flex;
      align-items: center;
      border: 1px solid #DDE8E2;
      border-radius: 999px;
      background: #F7FAF8;
      color: #607575;
      padding: 0 14px;
      font-size: 13px;
      font-weight: 760;
    }

    body.legal-page .footer {
      margin-top: 0;
      padding: 16px 0;
      box-shadow: none;
    }

    body.legal-page .footer nav {
      display: flex;
      gap: 14px;
      flex-wrap: wrap;
    }

    /* Single public search source: the header search is the only visible search box. */
    body:not(.account-page):not(.access-page):not(.legal-page) .filters .filter-input {
      display: none !important;
    }

    body:not(.account-page):not(.access-page):not(.legal-page) .filters {
      grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)) !important;
    }

    /* Final public UX polish: cleaner profile sheets, editorial tagline, no fake stats. */
    body:not(.account-page) .public-module-hero {
      gap: 16px !important;
    }

    body:not(.account-page) .public-module-hero .hero-stats {
      display: none !important;
    }

    @media (min-width: 761px) {
      body:not(.account-page) .home-map-card {
        grid-template-columns: 54px minmax(260px, auto) auto !important;
        justify-content: center !important;
        max-width: 780px !important;
        margin: 14px auto 20px !important;
        padding: 4px 0 !important;
        gap: 12px !important;
        border-color: transparent !important;
        background: transparent !important;
        box-shadow: none !important;
      }

      body:not(.account-page) .home-map-visual {
        min-height: 54px !important;
        border-radius: 10px !important;
        background: #EEF6EF !important;
        box-shadow: none !important;
      }

      body:not(.account-page) .home-map-card h2 {
        font-size: 22px !important;
      }

      body:not(.account-page) .home-map-card p:not(.home-free-kicker) {
        margin-top: 2px !important;
      }

      body:not(.account-page) .zones {
        border-top: 1px solid #E1E9E5 !important;
        border-bottom: 1px solid #E1E9E5 !important;
        background: #FAFBF8 !important;
      }

      body:not(.account-page) .zones .w {
        justify-content: center !important;
        gap: 0 !important;
      }

      body:not(.account-page) .zone-btn {
        min-height: 36px !important;
        padding: 0 14px !important;
        border-right: 1px solid #E1E9E5 !important;
      }

      body:not(.account-page) .zone-btn:first-child {
        border-left: 1px solid #E1E9E5 !important;
      }

      body:not(.account-page) .filters {
        padding: 0 !important;
        gap: 0 !important;
        border-top: 1px solid #E7EEE9 !important;
        border-bottom: 1px solid #E7EEE9 !important;
        background: #FFFFFF !important;
      }

      body:not(.account-page) .filter-input,
      body:not(.account-page) .filter-select {
        height: 46px !important;
        border: 0 !important;
        border-right: 1px solid #E7EEE9 !important;
        border-radius: 0 !important;
        background: #FFFFFF !important;
      }

      body:not(.account-page) .filters .filter-select:last-child,
      body:not(.account-page) .filters .filter-input:last-child {
        border-right: 0 !important;
      }

      body:not(.account-page) .footer-inner {
        justify-content: center !important;
        align-items: center !important;
        gap: 10px 18px !important;
        text-align: center !important;
      }

      body:not(.account-page) .footer-links {
        justify-content: center !important;
        gap: 12px !important;
      }
    }

    body:not(.account-page) .tagline-strip {
      width: min(900px, calc(100% - 32px)) !important;
      margin: 18px auto 14px !important;
      padding: 0 !important;
      background: #FBFAF5 !important;
      border: 1px solid #DDE8E2 !important;
      border-radius: 18px !important;
      box-shadow: 0 1px 0 rgba(255,255,255,.9) inset !important;
    }

    body:not(.account-page) .tagline-strip .w.tagline-inner {
      width: 100% !important;
      min-height: auto !important;
      margin: 0 auto !important;
      border: 0 !important;
      padding: 24px 26px !important;
      align-items: center !important;
      text-align: center !important;
      gap: 8px !important;
    }

    body:not(.account-page) .tagline-main {
      color: #063047 !important;
      font-size: 24px !important;
      line-height: 1.12 !important;
      font-weight: 860 !important;
      letter-spacing: 0 !important;
    }

    body:not(.account-page) .tagline-sub {
      color: #526A63 !important;
      font-size: 16px !important;
      line-height: 1.35 !important;
      font-weight: 560 !important;
      letter-spacing: 0 !important;
    }

    body:not(.account-page) .home-free-commercial p:not(.home-free-kicker) + p:not(.home-free-kicker) {
      margin-top: 10px !important;
    }

    @media (min-width: 681px) {
    .recommendation-detail-overlay {
      padding: 24px !important;
    }

    .recommendation-detail-sheet {
      width: min(980px, 100%) !important;
      max-height: min(800px, calc(100dvh - 48px)) !important;
      padding: 24px !important;
      overscroll-behavior: contain;
    }

    .recommendation-detail-hero {
      grid-template-columns: minmax(260px, 380px) minmax(0, 1fr) !important;
      gap: 22px !important;
      padding-right: 38px !important;
      align-items: start !important;
    }

    .recommendation-detail-photo,
    .recommendation-detail-media,
    .recommendation-detail-avatar {
      width: 100% !important;
      height: auto !important;
      aspect-ratio: 4 / 3 !important;
      border-radius: 14px !important;
    }

    .recommendation-detail-photo .recommendation-detail-media {
      width: 100% !important;
      height: 100% !important;
      aspect-ratio: auto !important;
    }

    .recommendation-detail-titleblock h2 {
      font-size: 26px !important;
      line-height: 1.12 !important;
      padding-right: 0 !important;
    }

    .recommendation-detail-meta {
      margin-top: 14px !important;
      gap: 7px !important;
    }

    .recommendation-detail-meta span {
      min-height: 26px !important;
      background: #F7FAF8 !important;
      border: 1px solid #DDE8E2 !important;
      color: #0B4A45 !important;
    }

    .recommendation-detail-score,
    .recommendation-detail-nudge,
    .recommendation-detail-reason-row {
      background: #F9FCFA !important;
      border-color: #DDE8E2 !important;
      color: #2F4A4A !important;
    }

    .recommendation-detail-actions {
      gap: 10px !important;
    }

    .recommendation-detail-actions .btn {
      min-height: 42px !important;
      padding-inline: 16px !important;
    }

    .public-detail-sheet {
      width: min(760px, 100%) !important;
      overscroll-behavior: contain;
    }
    }

    @media (max-width: 560px) {
      .access-main {
        padding: 24px 14px 28px;
      }

      .access-card {
        padding: 20px;
        border-radius: 12px;
      }

      .access-copy h1 {
        font-size: 24px;
      }

      .access-links {
        flex-direction: column;
        align-items: flex-start;
      }

      .legal-main {
        padding: 18px 14px 24px;
      }

      .legal-card {
        padding: 20px;
        border-radius: 12px;
      }

      .legal-actions {
        align-items: stretch;
      }

      .legal-actions .btn,
      .legal-muted-action {
        width: 100%;
        justify-content: center;
      }

      body:not(.account-page) .tagline-strip .w.tagline-inner {
        width: 100% !important;
        padding: 15px 16px !important;
        gap: 5px !important;
      }

      body:not(.account-page) .tagline-strip {
        width: calc(100% - 24px) !important;
        margin: 10px auto 10px !important;
        border-radius: 14px !important;
      }

      body:not(.account-page) .tagline-main {
        font-size: 17px !important;
        line-height: 1.18 !important;
      }

      body:not(.account-page) .tagline-sub {
        font-size: 13.5px !important;
        line-height: 1.32 !important;
      }

      .recommendation-detail-overlay {
        padding: 0 !important;
      }

      .recommendation-detail-sheet {
        width: 100% !important;
        max-height: min(84dvh, 760px) !important;
        padding: 16px 16px calc(20px + env(safe-area-inset-bottom)) !important;
        border-radius: 20px 20px 0 0 !important;
      }

      .recommendation-detail-hero {
        grid-template-columns: 84px minmax(0, 1fr) !important;
        gap: 12px !important;
        padding-right: 36px !important;
      }

      .recommendation-detail-media,
      .recommendation-detail-avatar {
        width: 84px !important;
        height: 74px !important;
        border-radius: 15px !important;
      }

      .recommendation-detail-titleblock h2 {
        font-size: 21px !important;
      }
    }
