.family-location {
  --location-page: var(--family-surface, #F6F3EA);
  --location-card: var(--family-surface-raised, #FFFFFF);
  --location-ink: var(--family-ink, #1C2822);
  --location-muted: var(--family-muted, #5E6A62);
  --location-line: var(--family-line, #DDE2D9);
  --location-accent: var(--family-accent, #1C2822);
  --location-accent-ink: var(--family-accent-ink, #FFFDF5);
  --location-warning: #8C4E32;
  color: var(--location-ink);
  min-width: 0;
}
.family-location[data-family-location-mode=phone] {
  --location-page: var(--family-surface-raised, #101412);
  --location-card: var(--family-surface, #2A2E2C);
  --location-ink: var(--family-ink, #F4F1E8);
  --location-muted: var(--family-muted, #C9D0C8);
  --location-line: var(--family-line, #424942);
  --location-accent: var(--family-accent, #F4F1E8);
  --location-accent-ink: var(--family-accent-ink, #101412);
  --location-warning: #F1A59B;
  color-scheme: dark;
}
.family-location[data-family-location-mode=phone][data-family-location-appearance=light] {
  --location-page: var(--family-surface-raised, #F6F3EA);
  --location-card: var(--family-surface, #FFFFFF);
  --location-ink: var(--family-ink, #1C2822);
  --location-muted: var(--family-muted, #5E6A62);
  --location-line: var(--family-line, #DDE2D9);
  --location-accent: var(--family-accent, #1C2822);
  --location-accent-ink: var(--family-accent-ink, #FFFDF5);
  --location-warning: #AA3E37;
  color-scheme: light;
}
.family-location-card {
  box-sizing: border-box; width: 100%; min-width: 0;
  border: 1px solid var(--location-line); border-radius: 20px;
  padding: 22px; margin: 0;
  background: var(--location-card); color: var(--location-ink);
}
/* Preserve this sidecar's controls when mounted inside the shared Family form. */
.family-location svg,
#family-content .family-location svg { display: block; width: 22px; height: 22px; flex: 0 0 auto; }
.family-location-heading { display: flex; align-items: center; gap: 14px; justify-content: space-between; }
.family-location-title { display: flex; align-items: center; gap: 12px; min-width: 0; }
.family-location-heading h3,
#family-content .family-location .family-location-heading h3 { margin: 0; font-family: var(--family-title-font, Georgia, serif); font-size: 24px; line-height: 1.25; font-weight: 500; overflow-wrap: anywhere; }
.family-location-glyph { color: var(--location-muted); flex: 0 0 auto; }
.family-location .family-location-refresh,
#family-content .family-location .family-location-refresh {
  display: grid; place-items: center; flex: 0 0 48px; width: 48px; min-height: 48px;
  padding: 0; border: 1px solid var(--location-line); border-radius: 50%;
  background: transparent; color: var(--location-ink);
}
.family-location-status-row { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; margin: 15px 0 0; }
.family-location-status { display: inline-flex; align-items: center; gap: 8px; max-width: 100%; padding: 7px 10px; border: 1px solid var(--location-line); border-radius: 9px; background: var(--location-page); color: var(--location-muted); font-size: 13px; line-height: 1.4; overflow-wrap: anywhere; }
.family-location-status-dot { width: 6px; height: 6px; border-radius: 50%; background: currentColor; flex: 0 0 auto; }
.family-location-status[data-status=live] { color: var(--location-accent); }
.family-location-status[data-status=stale], .family-location-status[data-status=offline], .family-location-status[data-status=unconfirmed] { color: var(--location-warning); }
.family-location-checking { color: var(--location-muted); font-size: 12px; }
.family-location-state { text-align: center; padding: 26px 8px 18px; }
.family-location-state-icon { display: grid; place-items: center; width: 56px; height: 56px; margin: 0 auto 16px; border-radius: 18px; border: 1px solid var(--location-line); background: var(--location-page); color: var(--location-muted); }
.family-location-state-icon svg,
#family-content .family-location .family-location-state-icon svg { width: 26px; height: 26px; }
.family-location-state h4,
#family-content .family-location .family-location-state h4 { font: inherit; font-size: 18px; line-height: 1.4; font-weight: 600; margin: 0 0 9px; }
.family-location-card p,
#family-content .family-location p { max-width: 72ch; line-height: 1.55; font-size: 14px; }
.family-location-state p,
#family-content .family-location .family-location-state p { margin: 0; color: var(--location-muted); }
.family-location-state button { margin-top: 18px; }
.family-location .family-location-note,
#family-content .family-location .family-location-note { color: var(--location-muted); font-size: 12px; line-height: 1.5; }
.family-location-map-consent,
#family-content .family-location .family-location-map-consent { margin: 12px 0 0; }
.family-location-last-report,
#family-content .family-location .family-location-last-report { color: var(--location-warning); margin: 18px 0 0; }
.family-location-error,
#family-content .family-location .family-location-error { margin: 18px 0; padding: 12px 14px; border: 1px solid var(--location-warning); border-radius: 12px; color: var(--location-warning); background: var(--location-page); overflow-wrap: anywhere; }
.family-location-point { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 18px 0; }
.family-location-point div { min-width: 0; border: 1px solid var(--location-line); border-radius: 12px; padding: 13px; background: var(--location-page); }
.family-location-point dt { color: var(--location-muted); font-size: 12px; line-height: 1.4; }
.family-location-point dd { margin: 6px 0 0; font-size: 14px; line-height: 1.5; font-weight: 500; overflow-wrap: anywhere; }
.family-location-map-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.family-location .family-location-primary, .family-location .family-location-map-link, .family-location .family-location-secondary,
#family-content .family-location .family-location-primary, #family-content .family-location .family-location-map-link, #family-content .family-location .family-location-secondary {
  box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: 48px; padding: 12px 18px; max-width: 100%; width: auto;
  font: inherit; font-size: 14px; font-weight: 600; line-height: 1.4; white-space: normal;
  border: 1px solid var(--location-accent); border-radius: 14px; text-decoration: none;
  background: var(--location-accent); color: var(--location-accent-ink);
}
.family-location .family-location-map-link,
#family-content .family-location .family-location-map-link { width: 100%; }
.family-location .family-location-secondary,
#family-content .family-location .family-location-secondary { background: transparent; border-color: var(--location-line); color: var(--location-ink); }
.family-location .family-location-map-secondary { display: inline-flex; align-items: center; gap: 8px; min-height: 48px; padding: 8px 0; font-size: 14px; line-height: 1.4; color: var(--location-ink); }
.family-location a { overflow-wrap: anywhere; }
.family-location-map[hidden] { display: none; }
.family-location-map { margin: 18px 0; border: 1px solid var(--location-line); border-radius: 14px; overflow: hidden; min-width: 200px; background: var(--location-page); }
.family-location-map iframe { display: block; width: 100%; min-width: 200px; height: 300px; min-height: 200px; border: 0; }
.family-location-actions { display: flex; gap: 10px; margin: 18px 0 0; }
.family-location-actions button { flex: 1 1 auto; }
.family-location-details, .family-location-help { margin-top: 18px; padding-top: 3px; border-top: 1px solid var(--location-line); }
.family-location summary,
#family-content .family-location summary { box-sizing: border-box; display: flex; align-items: center; gap: 9px; min-height: 48px; padding: 10px 0; cursor: pointer; list-style: none; color: var(--location-muted); font-size: 13px; line-height: 1.4; font-weight: 500; }
.family-location summary::-webkit-details-marker,
#family-content .family-location summary::-webkit-details-marker { display: none; }
.family-location summary::after,
#family-content .family-location summary::after { content: '›'; font-size: 22px; line-height: 1; margin-left: auto; transform: rotate(90deg); }
.family-location details[open] > summary::after,
#family-content .family-location details[open] > summary::after { content: '›'; transform: rotate(-90deg); }
.family-location-help > div { padding-bottom: 3px; }
.family-location-help p,
#family-content .family-location .family-location-help p { margin: 8px 0 12px; color: var(--location-muted); font-size: 13px; }
.family-location-help summary svg,
#family-content .family-location .family-location-help summary svg { width: 17px; height: 17px; }
.family-location button:disabled,
#family-content .family-location button:disabled { opacity: .5; cursor: default; }
.family-location button:focus-visible, .family-location a:focus-visible, .family-location summary:focus-visible,
#family-content .family-location button:focus-visible, #family-content .family-location a:focus-visible, #family-content .family-location summary:focus-visible { outline: 3px solid var(--location-accent); outline-offset: 3px; }
@media(max-width: 520px) {
  .family-location-card { padding: 18px; }
  .family-location-point { grid-template-columns: 1fr; gap: 10px; }
  .family-location-map-actions > button,
  #family-content .family-location .family-location-map-actions > button { width: 100%; }
  .family-location-heading h3,
  #family-content .family-location .family-location-heading h3 { font-size: 22px; }
}

[data-location-places]{margin-top:24px;padding-top:20px;border-top:1px solid currentColor}[data-place-form]{display:grid;gap:12px}[data-place-form] label{display:grid;gap:6px}[data-place-form] input,[data-place-form] select{max-width:100%;min-width:0;width:100%;padding:10px;border-radius:10px}[data-place-list] p{display:flex;gap:12px;align-items:center;flex-wrap:wrap}[data-place-events]{margin-top:16px}
