/* Daily family workspace only. Classic, authentication and global admin keep
   their existing layout and theme. Space is reserved for the persistent menu. */
html:has(body[data-family-shell="child"]), html:has(body[data-family-shell="parent"]) {
  --family-nav-space: calc(4rem + 52px + env(safe-area-inset-bottom, 0px));
  scroll-padding-bottom: var(--family-nav-space);
}
body[data-family-shell="child"], body[data-family-shell="parent"] {
  padding-bottom: 0;
  scroll-padding-bottom: var(--family-nav-space);
}
body[data-family-shell="child"] .app-shell,
body[data-family-shell="parent"] .app-shell {
  padding: 16px max(14px, env(safe-area-inset-right)) var(--family-nav-space) max(14px, env(safe-area-inset-left));
}
body[data-family-shell="child"] .app-shell { max-width: 680px; }
body[data-family-shell="parent"] .app-shell { max-width: 1080px; }
body[data-family-shell="child"] .app-footer,
body[data-family-shell="parent"] .app-footer,
body[data-family-shell="child"] .pwa-install-root,
body[data-family-shell="parent"] .pwa-install-root { display: none; }
body[data-family-shell="child"] .pwa-status-root,
body[data-family-shell="parent"] .pwa-status-root { bottom: var(--family-nav-space); }
body[data-family-shell="child"] :is(button,input,select,textarea,summary,a),
body[data-family-shell="parent"] :is(button,input,select,textarea,summary,a) { scroll-margin-bottom: var(--family-nav-space); }
.family-compact-topbar { padding: 8px 12px; margin-bottom: 12px; gap: 10px; border-radius: 14px; }
.family-compact-topbar .brand { min-width: 0; gap: 8px; font-size: 1rem; }
.family-compact-topbar .brand > div:last-child { min-width: 0; }
.family-compact-topbar .brand-mark { width: 36px; height: 36px; flex: 0 0 36px; border-radius: 10px; }
.family-compact-topbar .brand-mark img { width: 100%; height: 100%; object-fit: contain; }
.family-compact-topbar .language-line { margin: 0; font-size: .8rem; line-height: 1.3; overflow-wrap: anywhere; }
.family-compact-topbar .refresh-button { width: 44px; height: 44px; min-height: 44px; border-radius: 10px; }
.daily-family-main { display: block; min-width: 0; }
.daily-family-main > *, .daily-family-main .family-module-panel { min-width: 0; }
.family-bottom-nav {
  position: fixed; z-index: 40; left: 50%; bottom: 0; transform: translateX(-50%);
  display: flex; align-items: stretch; width: min(100%, 680px); gap: 4px;
  padding: 6px max(8px, env(safe-area-inset-right)) max(6px, env(safe-area-inset-bottom)) max(8px, env(safe-area-inset-left));
  background: var(--panel-strong); border: 1px solid var(--line); border-bottom: 0;
  border-radius: 18px 18px 0 0; box-shadow: 0 -4px 16px color-mix(in srgb, var(--text) 5%, transparent);
}
.family-bottom-nav button {
  display: flex; flex: 1 1 0; flex-direction: column; align-items: center; justify-content: center;
  min-width: 0; min-height: 52px; padding: 5px 4px; gap: 2px;
  background: transparent; color: var(--muted); border: 1px solid transparent; border-radius: 12px;
  font-size: .78rem; line-height: 1.3; font-weight: 650; overflow-wrap: anywhere;
}
.family-bottom-nav .ui-icon { width: 22px; height: 22px; flex-shrink: 0; }
.family-bottom-nav button[aria-current="page"] { background: var(--accent-soft); border-color: var(--accent); color: var(--text); }
.family-bottom-nav button:focus-visible { outline: 3px solid var(--accent); outline-offset: -3px; }
.family-more { display: grid; gap: 16px; }
.family-more h1, .child-money-view > h1 { margin: 0; font-size: 1.5rem; line-height: 1.3; }
.family-more-links { border: 1px solid var(--line); border-radius: 14px; background: var(--panel); overflow: hidden; }
.family-more-links > button {
  display: flex; align-items: center; gap: 12px; width: 100%; min-height: 52px; padding: 10px 14px;
  color: var(--text); background: transparent; text-align: left; font-size: 1rem; border-radius: 0;
  white-space: normal; overflow-wrap: anywhere;
}
.family-more-links > button + button { border-top: 1px solid var(--line); }
.family-more-links > button > span:nth-child(2) { flex: 1; }
.family-more-links .ui-icon { width: 22px; height: 22px; flex-shrink: 0; color: var(--accent); }
.family-more-links > button:hover, .family-more-links > button:focus-visible { background: var(--accent-soft); }
.family-more-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 14px; font-size: .82rem; }
.family-more-meta a { display: inline-flex; align-items: center; min-height: 44px; }
.family-more-meta .footer-public-links { display: flex; flex-wrap: wrap; gap: 14px; }
.child-money-view { display: grid; gap: 12px; }
.child-money-view .child-allowance-module { gap: 14px; }
.child-money-view .module-subsection { margin-top: 12px; padding-top: 12px; }
.family-dayplan .dayplan-toolbar { margin: 0 0 8px; min-height: 0; }
.family-dayplan .dayplan-toolbar.is-quiet { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.family-dayplan [data-dayplan-header]:empty, .family-dayplan [data-legacy-calendar]:empty { display: none; }
.daily-timer { margin-top: 8px; border: 1px solid var(--line); background: var(--panel); border-radius: 13px; overflow: hidden; }
.daily-timer > summary { min-height: 48px; padding: 12px; cursor: pointer; }
.daily-timer > summary > span { margin-left: 12px; color: var(--accent); font-size: .82rem; }
.daily-timer > div { display: grid; gap: 10px; padding: 0 12px 12px; }
.daily-timer .tool-panel { min-width: 0; padding: 10px; }
.daily-timer .compact-add-row { display: flex; flex-wrap: wrap; gap: 8px; }
.daily-timer input { min-width: 0; width: 100%; min-height: 44px; }
.daily-timer button { min-height: 44px; }
.daily-family-main > [data-dayplan-suggestions] { margin-bottom: 10px; }
@media(max-width: 600px) {
  body[data-family-shell="child"] .app-shell, body[data-family-shell="parent"] .app-shell { padding-top: max(8px, env(safe-area-inset-top)); padding-inline: max(10px, env(safe-area-inset-left)) max(10px, env(safe-area-inset-right)); }
  .family-compact-topbar { margin-bottom: 10px; padding: 6px 10px; }
  .daily-family-main .card { padding: 14px; border-radius: 14px; }
  .daily-family-main .module-header { gap: 8px; margin-bottom: 12px; }
  .daily-family-main .section-title { font-size: 1.25rem; }
  .daily-family-main .child-module-workspace { gap: 12px; }
  .family-more { gap: 12px; }
}