@charset "UTF-8";
/* One shared palette for the family house. Keep saved theme and card preferences. */
:root {
  --cream: #f6f7ef;
  --paper: #fffefa;
  --ink: #183f43;
  --muted: #566b65;
  --olive: #145b64;
  --sage: #e7efdc;
  --line: #d2dfd7;
  --clay: #ae4431;
  --yellow: #ffda68;
  --action: #175c65;
  --action-ink: #fff;
  --action-hover: #104b53;
  --surface-green: #e9f1df;
  --surface-yellow: #fff4d7;
  --surface-coral: #ffede5;
  --surface-blue: #e9f3f1;
  --surface-muted: #f0f4ed;
  --field: #fff;
  --field-line: #829e91;
  --danger: #a23b2c;
  --danger-soft: #fff0e8;
  --warning-ink: #76530c;
  --success-ink: #3a5c2d;
  --shadow: 0 6px 24px #173f4110;
  --dock: #fffefaf5;
  --dock-line: #ccdcd1;
  --serif: ui-rounded, 'Arial Rounded MT Bold', system-ui, sans-serif;
}

body[data-theme="dark"] {
  color-scheme: dark;
  --cream: #10282c;
  --paper: #1c383d;
  --ink: #f2f6ec;
  --muted: #bdcdc5;
  --olive: #cce4b6;
  --sage: #2c4a40;
  --line: #48645f;
  --clay: #ffba9e;
  --yellow: #f0cc68;
  --action: #cce4b6;
  --action-ink: #183c30;
  --action-hover: #dfefce;
  --surface-green: #29463b;
  --surface-yellow: #443f29;
  --surface-coral: #4a3430;
  --surface-blue: #23454a;
  --surface-muted: #203d3e;
  --field: #163238;
  --field-line: #78968a;
  --danger: #ffb6a2;
  --danger-soft: #4a302e;
  --warning-ink: #f3d88f;
  --success-ink: #d3e9bc;
  --shadow: 0 6px 24px #06181d25;
  --dock: #18363bf5;
  --dock-line: #48645f;
}

@media (prefers-color-scheme: dark) {
  body[data-theme="system"] {
    color-scheme: dark;
    --cream: #10282c;
    --paper: #1c383d;
    --ink: #f2f6ec;
    --muted: #bdcdc5;
    --olive: #cce4b6;
    --sage: #2c4a40;
    --line: #48645f;
    --clay: #ffba9e;
    --yellow: #f0cc68;
    --action: #cce4b6;
    --action-ink: #183c30;
    --action-hover: #dfefce;
    --surface-green: #29463b;
    --surface-yellow: #443f29;
    --surface-coral: #4a3430;
    --surface-blue: #23454a;
    --surface-muted: #203d3e;
    --field: #163238;
    --field-line: #78968a;
    --danger: #ffb6a2;
    --danger-soft: #4a302e;
    --warning-ink: #f3d88f;
    --success-ink: #d3e9bc;
    --shadow: 0 6px 24px #06181d25;
    --dock: #18363bf5;
    --dock-line: #48645f;
  }
}

body[data-theme="light"] { color-scheme: light; }
@media (prefers-color-scheme: light) {
  body[data-theme="system"] { color-scheme: light; }
}
body[data-theme] { background: var(--cream); color: var(--ink); }
h1, h2, h3 { color: inherit; letter-spacing: -.035em; }
a { text-decoration-thickness: 1px; }
a:hover { text-decoration-thickness: 2px; }
body[data-theme] :is(a, button, input, select, textarea, summary):focus-visible {
  outline: 3px solid var(--clay);
  outline-offset: 4px;
}
.eyebrow { color: var(--olive); font-weight: 750; line-height: 1.5; }
.lead, .muted, .empty, .section-intro, .help { color: var(--muted); }
.section-intro { max-width: 65ch; margin: 8px 0 22px; }
body[data-theme] :is(.site-header, .navigation) { background: var(--cream); }
body[data-theme] .navigation { background: var(--paper); border-color: var(--line); }
body[data-theme] .brand { color: var(--ink); }
body[data-theme] .navigation nav a[aria-current] {
  background: var(--surface-blue); color: var(--ink); border-color: var(--olive);
}
.navigation nav a:hover, .account-links a:hover { background: var(--surface-blue); border-radius: 8px; }
body[data-theme] :is(.nav-menu > div, .conversation-menu > div, .share-menu > div, .snooze-options form) {
  background: var(--paper); color: var(--ink); border-color: var(--line); box-shadow: var(--shadow);
}
body[data-theme] .nav-menu > div a:hover { background: var(--surface-blue); }
.nav-menu summary { color: var(--olive); }
.archive-nav a, .heritage-sections a, .year-pills a {
  display: inline-flex; align-items: center; min-height: 44px;
}
.profile-options a { display: flex; align-items: center; min-height: 44px; }
.conversation-menu :is(a, button), .share-menu a, .delete-menu a,
.message-actions :is(a, summary), .reaction-menu button, .delete-menu button {
  min-height: 44px;
}
.reaction-menu button { min-width: 44px; }
.message-actions a { display: inline-flex; align-items: center; }

/* A clear primary action, with readable text in light and dark themes. */
body[data-theme] :is(.button, .quick-add-button, .view-links > a.button, .archive-filters button) {
  background: var(--action); color: var(--action-ink); border-color: var(--action);
  min-height: 46px; border-radius: 12px; line-height: 1.35;
}
body[data-theme] :is(.button, .quick-add-button, .archive-filters button):hover {
  background: var(--action-hover); color: var(--action-ink); border-color: var(--action-hover);
  transform: none;
}
body[data-theme] .button.secondary {
  background: transparent; color: var(--olive); border-color: var(--field-line);
}
body[data-theme] .button.secondary:hover { background: var(--surface-blue); color: var(--olive); }
body[data-theme] .button.destructive { background: var(--danger); border-color: var(--danger); color: var(--paper); }
body[data-theme] :is(.text-button, .back) { color: var(--olive); min-height: 44px; }
.back { display: inline-flex; align-items: center; margin-bottom: 20px; }
.dashboard-tools > a:not(.button), .section-title > a { min-height: 44px; display: inline-flex; align-items: center; }
.dashboard-tools-links { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 20px; }
body[data-theme] .danger { color: var(--danger); }
body[data-theme] .skip { background: var(--paper); color: var(--ink); }

/* Surfaces: replace old fixed whites and pastels, rather than recolouring content. */
body[data-theme] :is(.dashboard-card, .today-section, .panel, .record, .paper-form, .login-card,
  .together-card, .content-card, .archive-door, .archive-record, .storage-overview > :where(div),
  .person-node, .heritage-rooms > :where(a), .heritage-counts :where(div), .people-index > :where(a),
  .relationship-list :where(p), .archive-card-list > :where(a, span), .permission-list :where(form),
  .family-book, .contact-row, .contact-detail, .assistant-item, .quick-add-grid a) {
  background: var(--paper); color: var(--ink); border-color: var(--line);
}
body[data-theme] :is(.dashboard-card, .panel, .contact-detail, .login-card) { box-shadow: var(--shadow); }
body[data-theme] :is(.dashboard-side .dashboard-card:nth-child(2n), .birthday-card,
  .note, .record.note, .occasions, .attention-box, .pet-profile,
  .quick-add-grid a:nth-child(3n + 2), .profile-grid .record:nth-child(3n + 2)) {
  background: var(--surface-yellow); color: var(--ink); border-color: var(--line);
}
body[data-theme] :is(.dashboard-side .shopping-preview, .side-room .shopping-preview,
  .quick-add, .contact-search, .continue-card, .private-note, .little-memories,
  .heritage-rooms > a:nth-child(2n), .revision-history, .media-memory, .privacy-note,
  .print-note, .quick-add-grid a:nth-child(3n), .profile-grid .record:nth-child(3n)) {
  background: var(--surface-green); color: var(--ink); border-color: var(--line);
}
body[data-theme] :is(.note:nth-child(even), .door-dates) { background: var(--surface-coral); color: var(--ink); }
body[data-theme] :is(.door-albums, .date-tile) { background: var(--surface-green); color: var(--ink); border-color: var(--line); }
body[data-theme] .door-memories { background: var(--surface-yellow); }
body[data-theme] :is(.door-documents, .family-hello, .person-cover, .heritage-tree) {
  background: var(--surface-blue); color: var(--ink); border-color: var(--line);
}
body[data-theme] :is(.smart-home, .quiet, .completed, .tree-generation, .conversation-list,
  .dashboard-form li label, .merge-preview div, .relation-result) {
  background: var(--surface-muted); color: var(--ink); border-color: var(--line);
}
body[data-theme] :is(.together-card span, .archive-door p, .door-number, .photo-grid figcaption,
  .heritage-hint, .person-node small, .tree-empty, .heritage-rooms span, .heritage-rooms p,
  .heritage-counts dt, .tree-generation h2, .people-index p, .people-index small,
  .relationship-list span, .life-line article span, .archive-card-list span,
  .archive-card-list small, .heritage-photos figcaption span, .relation-result span,
  .audience, .completed h2, .family-hello .lead, .family-hello .eyebrow) { color: var(--muted); }
body[data-theme] .family-hello h1 span { color: var(--warning-ink); }
body[data-theme] :is(.person-initial, .avatar, .contact-avatar) {
  background: var(--surface-green); color: var(--olive); border-color: var(--paper);
}
body[data-theme] :is(.profile-portrait img, .contact-avatar) { border-color: var(--paper); }
body[data-theme] :is(.album-image, .contact-shortcuts a, .view-links a, .favorite-links a,
  .admin-shortcuts a, .heritage-sections a, .year-pills a, .profile-options summary) {
  background: var(--surface-blue); color: var(--olive); border-color: var(--line);
}
body[data-theme] .album-image span { color: var(--muted); }
body[data-theme] :is(.heritage-sections a[aria-current], .generation-label) {
  background: var(--action); color: var(--action-ink); border-color: var(--action);
}
body[data-theme] .year-heading h1 { color: var(--olive); }
body[data-theme] :is(.archive-nav, .heritage-hero, .heritage-form-card td,
  .heritage-form-card th, .family-book section, .wish, .search-group) { border-color: var(--line); }
body[data-theme] :is(.tree-empty, .archive-form fieldset, .empty-state, .contact-coming) { border-color: var(--field-line); }

/* Dashboard: calm hierarchy, full labels and no sideways action strip. */
.dashboard-welcome { align-items: center; gap: 28px; padding-top: 36px; }
.dashboard-welcome > div:first-child { min-width: 0; }
.dashboard-welcome h1 { font-size: clamp(2rem, 4vw, 3.2rem); line-height: 1.13; }
.dashboard-welcome .lead { font-size: 1rem; max-width: 59ch; }
.dashboard-welcome .eyebrow { margin-bottom: 10px; }
.dashboard-tools { gap: 4px; }
.dashboard-actions {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px;
  margin: 0 0 26px; padding: 0; overflow: visible;
}
body[data-theme] :is(.dashboard-actions a, .continue-card a) {
  background: var(--paper); color: var(--olive); border-color: var(--line);
  min-width: 0; min-height: 48px; white-space: normal; border-radius: 12px;
  line-height: 1.4; font-weight: 650;
}
body[data-theme] :is(.dashboard-actions a, .continue-card a):hover {
  background: var(--surface-blue); border-color: var(--field-line);
}
.dashboard { gap: 24px; }
.dashboard-card { padding: 26px; border-radius: 20px; margin-bottom: 24px; }
.dashboard-card .eyebrow { margin-bottom: 14px; font-size: .75rem; letter-spacing: .1em; }
.dashboard-card h2 { font-size: 1.55rem; line-height: 1.22; }
.dashboard-card .section-title { gap: 10px 20px; margin-bottom: 16px; }
.dashboard-card .section-title h2 { margin-bottom: 0; }
.dashboard-card .section-title > a { font-size: .9rem; }
.dashboard-card > :last-child { margin-bottom: 0; }
body[data-theme] .dashboard-card.today-card { border-top: 5px solid var(--yellow); }
body[data-theme] .family-hello { border-bottom-color: var(--yellow); }
body[data-theme] .date-label { background: var(--surface-yellow); color: var(--warning-ink); }
.empty { padding: 6px 0; line-height: 1.6; }
.empty-action { display: flex; flex-wrap: wrap; gap: 6px 20px; align-items: center; margin-top: 12px; }
.empty-action p { flex-basis: 100%; color: var(--muted); margin: 0; }
.empty-action a { min-height: 44px; display: inline-flex; align-items: center; }
.next-appointment { font-size: .95rem; margin: 14px 0 0; }
.shopping-preview ul { margin-top: 8px; margin-bottom: 16px; }
.shopping-preview .arrow-link { margin-bottom: 0; }
.upcoming-card .upcoming-line { min-height: 60px; }
body[data-theme] .upcoming-card .upcoming-line.is-today { background: var(--surface-yellow); }
body[data-theme] .upcoming-card .upcoming-line.is-tomorrow { background: var(--surface-green); }
body[data-theme] :is(.attention > span, .favorite-star, .task-overdue small) { color: var(--warning-ink); }
body[data-theme] .today-birthday > span { color: var(--clay); }
body[data-theme] .task-line > span { color: var(--olive); }
body[data-theme] :is(.pill, .confidence) { background: var(--surface-green); color: var(--success-ink); }
body[data-theme] :is(.pill.coral, .pill.off, .confidence-uncertain) { background: var(--surface-coral); color: var(--danger); }
body[data-theme] .confidence-likely { background: var(--surface-yellow); color: var(--warning-ink); }
body[data-theme] :is(.notice-count, .dock-count, .pill.urgent, .unread-badge) { background: #a63f31; color: #fff; }

/* Forms use the same field surfaces and clear labels in every module. */
body[data-theme] :is(input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="hidden"]), select, textarea) {
  background-color: var(--field); color: var(--ink); border-color: var(--field-line);
  font: inherit; min-width: 0;
}
body[data-theme] :is(.field input:not([type="checkbox"]):not([type="radio"]),
  .field select, .field textarea, .quick-add input, .status-form select,
  .archive-filters input, .archive-filters select, .contact-search input,
  .contact-search select, .contact-search-form input, .contact-search-form select) {
  min-height: 48px; border-radius: 10px; padding: 11px 13px;
}
body[data-theme] :is(input, textarea)::placeholder { color: var(--muted); opacity: 1; }
body[data-theme] .field select[multiple] { min-height: 130px; }
body[data-theme] :is(input[type="checkbox"], input[type="radio"]) { accent-color: var(--action); }
body[data-theme] :is(.field label, .quick-add label, .contact-search label, .archive-form legend) { color: var(--ink); }
.field { margin: 22px 0; }
.field label { line-height: 1.45; margin-bottom: 8px; }
.field .help { margin-top: 9px; }
.paper-form .actions { gap: 12px 24px; padding-top: 10px; }
body[data-theme] .archive-filters select {
  background-image: linear-gradient(45deg, transparent 50%, var(--ink) 50%), linear-gradient(135deg, var(--ink) 50%, transparent 50%);
  padding-right: 2rem;
}
body[data-theme] .errorlist { background: var(--danger-soft); color: var(--danger); border: 1px solid var(--danger); }
body[data-theme] .messages { background: var(--surface-green); color: var(--ink); border: 1px solid var(--line); }
body[data-theme] .storage-warning { background: var(--surface-yellow); color: var(--warning-ink); }
body[data-theme] :is(.reactions button, .quick-choices button, .reaction-menu, .delete-menu) {
  background: var(--paper); color: var(--ink); border-color: var(--line);
}
body[data-theme] :is(.quiet-button, .attach-button) { color: var(--olive); min-height: 44px; min-width: 44px; }
body[data-theme] .calendar { background: var(--paper); }
body[data-theme] .calendar-day p { background: var(--surface-blue); }
body[data-theme] .calendar-day.is-today { background: var(--surface-yellow); }

/* Conversation cards and bubbles must follow the selected theme as well. */
body[data-theme] .message-thread { background: var(--cream); }
body[data-theme] .message { background: var(--surface-muted); color: var(--ink); border-color: var(--line); }
body[data-theme] .message-own { background: var(--surface-green); }
body[data-theme] .message-system { background: transparent; color: var(--muted); }
body[data-theme] .message-deleted { color: var(--muted); }
body[data-theme] .message-composer textarea { background: var(--field); color: var(--ink); border: 1px solid var(--field-line); }
body[data-theme] .app-notice { background: var(--paper); color: var(--ink); border-color: var(--line); }
body[data-theme] .app-notice[data-kind="offline"] { background: #674333; color: #fff; }
body[data-theme] .app-notice[data-kind="online"] { background: #365b47; color: #fff; }
body[data-theme] .app-notice[data-kind="conflict"] { background: #79552e; color: #fff; }

/* Frequent destinations first; adding an item stays one clear step away. */
.dashboard-shortcuts { margin-bottom: 26px; }
.dashboard-shortcuts > h2 { font-size: 1.1rem; margin-bottom: 12px; }
.dashboard-destinations {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 12px;
  margin: 0;
}
.dashboard-actions, .dashboard-destinations, .view-links, .favorite-links {
  border: 0; padding: 0; justify-content: flex-start;
}
body[data-theme] .dashboard-destinations a {
  display: flex; flex-direction: column; justify-content: center; min-height: 88px;
  padding: 15px 18px; border: 1px solid var(--line); border-radius: 14px;
  background: var(--paper); color: var(--ink); text-decoration: none;
}
.dashboard-destinations strong { font-size: 1.03rem; }
.dashboard-destinations small { font-size: .84rem; color: var(--muted); margin-top: 3px; }
body[data-theme] .dashboard-destinations a:hover {
  background: var(--surface-blue); border-color: var(--field-line);
}
.dashboard-add-actions { margin: 0 0 26px; border-block: 1px solid var(--line); }
.dashboard-add-actions > summary {
  min-height: 48px; padding: 12px 2px; cursor: pointer; color: var(--olive); font-weight: 650;
}
.dashboard-add-actions[open] > summary { margin-bottom: 6px; }
.dashboard-add-actions .dashboard-actions { margin-bottom: 16px; }
.quick-add-group { margin-bottom: 32px; }
.quick-add-group > h2 { font-size: 1.4rem; margin-bottom: 8px; }
.quick-add-group > .help { margin: 0 0 16px; max-width: 65ch; }
.quick-add-group .quick-add-grid { margin-bottom: 0; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.quick-add-group .quick-add-grid a {
  display: grid; grid-template-columns: 26px minmax(0, 1fr); grid-template-rows: auto auto;
  gap: 4px 12px; align-content: center; justify-items: start; text-align: left;
  min-height: 108px; padding: 17px;
}
.quick-add-group .quick-add-grid a > span { grid-row: 1 / 3; font-size: 1.45rem; line-height: 1.4; }
.quick-add-group .quick-add-grid :is(strong, small) { grid-column: 2; }
.quick-add-group .quick-add-grid strong { font-size: 1rem; line-height: 1.35; }
.quick-add-group .quick-add-grid small { font-size: .84rem; line-height: 1.45; color: var(--muted); }
body[data-theme] .view-links a[aria-current="page"] {
  background: var(--action); color: var(--action-ink); border-color: var(--action); font-weight: 700;
}

/* A welcoming front room, with calm colour behind the greeting. */
body[data-theme] .dashboard-welcome {
  position: relative; margin: 24px 0 26px; padding: 30px;
  border: 1px solid var(--line); border-top: 4px solid var(--yellow); border-radius: 26px;
  background: radial-gradient(ellipse at 100% 0%, var(--surface-yellow), transparent 58%),
    linear-gradient(115deg, var(--surface-blue), var(--surface-green));
}
.welcome-copy {
  flex: 1 1 auto; display: grid; grid-template-columns: minmax(0, 1fr) 128px;
  align-items: center; gap: 0 20px;
}
.welcome-message { min-width: 0; }
.welcome-copy > .favorite-links { grid-column: 1 / -1; }
.welcome-snoopy {
  width: 128px; aspect-ratio: 1; margin: 0; align-self: center;
  border-radius: 50%; background: radial-gradient(circle, #fff9e5 0 58%, transparent 72%);
}
.welcome-snoopy img { display: block; width: 100%; height: auto; transform-origin: 50% 88%; }
.site-header .brand img { width: 52px; height: 51px; object-fit: contain; flex: 0 0 52px; }

/* Motion is brief and deliberate; information never keeps moving. */
@media (prefers-reduced-motion: no-preference) {
  @keyframes fasch-arrive {
    from { opacity: .65; transform: translateY(7px); }
    to { opacity: 1; transform: translateY(0); }
  }
  @keyframes fasch-snoopy-hello {
    0%, 100% { transform: translateY(0) rotate(0); }
    30% { transform: translateY(-5px) rotate(-4deg); }
    65% { transform: translateY(-2px) rotate(3deg); }
  }
  @keyframes fasch-snoopy-wiggle {
    0%, 100% { transform: rotate(0); }
    35% { transform: rotate(-5deg); }
    70% { transform: rotate(4deg); }
  }
  main#inhoud { animation: fasch-arrive 440ms ease-out backwards; }
  .dashboard-card { animation: fasch-arrive 520ms ease-out 70ms backwards; }
  .welcome-snoopy img { animation: fasch-snoopy-hello 900ms ease-in-out 280ms backwards; }
  body[data-theme] :is(.button, .quick-add-button, .dashboard-destinations a,
    .dashboard-actions a, .quick-add-grid a, .together-card, .archive-door,
    .heritage-rooms > a, .more-links a, .mobile-dock a) {
    transition: transform 180ms ease, background-color 180ms ease,
      border-color 180ms ease, box-shadow 180ms ease;
  }
  body[data-theme] :is(.button, .quick-add-button, .dashboard-destinations a,
    .dashboard-actions a, .quick-add-grid a, .together-card, .archive-door,
    .heritage-rooms > a, .more-links a):focus-visible {
    transform: translateY(-2px); box-shadow: var(--shadow);
  }
  body[data-theme] :is(.button, .quick-add-button, .dashboard-destinations a,
    .dashboard-actions a, .quick-add-grid a, .mobile-dock a):active { transform: scale(.985); }
}
@media (prefers-reduced-motion: no-preference) and (hover: hover) and (pointer: fine) {
  .welcome-snoopy:hover img { animation: fasch-snoopy-wiggle 480ms ease-in-out 2; }
  body[data-theme] :is(.button, .quick-add-button, .dashboard-destinations a,
    .dashboard-actions a, .quick-add-grid a, .together-card, .archive-door,
    .heritage-rooms > a, .more-links a):hover {
    transform: translateY(-2px); box-shadow: var(--shadow);
  }
}

@media (max-width: 900px) {
  .dashboard-welcome { align-items: flex-start; }
  .dashboard-actions { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  body[data-theme] .site-header { background: var(--cream); backdrop-filter: none; -webkit-backdrop-filter: none; }
  .dashboard-welcome { flex-direction: column; padding: 26px 0 18px; gap: 18px; }
  body[data-theme] .dashboard-welcome { margin: 20px 0; padding: 23px 20px; border-radius: 21px; }
  .welcome-copy { width: 100%; grid-template-columns: minmax(0, 1fr) 76px; gap: 0 12px; }
  .welcome-snoopy { width: 76px; }
  .dashboard-welcome .welcome-message h1 { font-size: clamp(1.65rem, 7.5vw, 2rem); }
  .site-header .brand img { width: 44px; height: 43px; flex-basis: 44px; }
  .dashboard-tools { width: 100%; align-items: stretch; }
  .dashboard-tools > a:not(.button) { align-self: flex-start; }
  .dashboard-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-right: 0; padding-right: 0; gap: 9px; }
  .dashboard-actions a { padding: 11px 12px; font-size: .875rem; }
  .dashboard-shortcuts { margin-bottom: 20px; }
  .dashboard-destinations { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
  body[data-theme] .dashboard-destinations a { min-height: 84px; padding: 13px; }
  .dashboard-destinations strong { font-size: .96rem; }
  .dashboard-destinations small { font-size: .8rem; }
  .quick-add-group .quick-add-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
  .quick-add-group .quick-add-grid a { padding: 14px 12px; min-height: 108px; grid-template-columns: 1fr; gap: 5px; }
  .quick-add-group .quick-add-grid a > span { grid-row: auto; }
  .quick-add-group .quick-add-grid :is(strong, small) { grid-column: 1; }
  .dashboard-card { padding: 22px; margin-bottom: 18px; }
  .dashboard-card h2 { font-size: 1.4rem; }
  .dashboard-card .section-title > a { min-height: 44px; }
  .dashboard-card .section-title { align-items: flex-start; }
  .dashboard { gap: 0; }
  .section-intro { margin-bottom: 18px; }
  .paper-form .actions .button { flex: 1 1 auto; }
  body[data-theme] .mobile-dock { background: var(--dock); border-color: var(--dock-line); }
  .mobile-dock { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); }
  body[data-theme] .mobile-dock a[aria-current] { color: var(--ink); background: var(--surface-green); }
}
@media (max-width: 360px) {
  .dashboard-actions { grid-template-columns: 1fr; }
  .dashboard-card { padding: 19px; }
}
@media (prefers-reduced-motion: reduce) {
  .archive-door:hover, .heritage-rooms > a:hover { transform: none; }
}
@media print {
  body[data-theme] { color-scheme: light; --cream: #fff; --paper: #fff; --ink: #183f43; --muted: #566b65; --olive: #145b64; --line: #ccd8d1; --shadow: none; }
  body[data-theme] .family-book { background: #fff; color: #183f43; }
}