/* Shared display preference for the public site and family area. */
:root {
  --danger-bg: #f9e9e5;
  --danger-ink: #8a3532;
  --focus: #52765e;
}
@media (prefers-color-scheme: dark) {
  :root {
    --danger-bg: #482e29;
    --danger-ink: #f4b9ad;
    --focus: #b7d5bc;
  }
}
:root[data-theme='light'] {
  --danger-bg: #f9e9e5;
  --danger-ink: #8a3532;
  --focus: #52765e;
}
:root[data-theme='dark'] {
  --danger-bg: #482e29;
  --danger-ink: #f4b9ad;
  --focus: #b7d5bc;
}
:focus-visible {
  outline-color: var(--focus);
}
.family-site .tools > .secondary,
.family-site .attention-item q,
.family-site .memory-note,
.family-site .skip {
  background: var(--solid);
  color: var(--ink);
}
.family-site .avatar,
.family-site .remove {
  background: var(--sage);
  color: var(--ink);
}
.family-site .step,
.family-site .required {
  color: var(--muted);
}
.family-site .badge.urgent,
.family-site .today-person[data-availability='blocked'] .person-state,
.family-site .today-person[data-availability='revoked'] .person-state,
.family-site .today-person[data-availability='declined'] .person-state {
  background: var(--danger-bg);
  color: var(--danger-ink);
}
.family-site .text-button.danger:hover {
  background: var(--danger-bg);
  color: var(--danger-ink);
}
.appearance {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: none;
  margin: 0;
  font-size: 12px;
  font-weight: 500;
  color: var(--muted);
}
.appearance select {
  font: inherit;
  color: var(--ink);
  background: var(--solid);
  border: 1px solid var(--line);
  border-radius: 999px;
  min-height: 44px;
  padding: 8px 12px;
  max-width: 145px;
  margin: 0;
}
:root[data-theme='dark'] {
  color-scheme: dark;
  --paper: #171918;
  --ink: #f2f4f1;
  --muted: #b8bdb9;
  --action: #b7d5bc;
  --accent: #b7d5bc;
  --sage: #28352c;
  --line: #3c423e;
  --glass: rgba(34, 37, 36, 0.9);
  --solid: #222524;
  --highlight: rgba(192, 219, 199, 0.19);
  --shadow: 0 12px 40px rgba(0, 0, 0, 0.12);
}
:root[data-theme='light'] {
  color-scheme: light;
  --paper: #f5f7f5;
  --ink: #23372c;
  --muted: #53645a;
  --action: #253f30;
  --accent: #31553d;
  --sage: #e7eee8;
  --line: #d5dfd7;
  --glass: rgba(255, 255, 255, 0.82);
  --solid: #fafcf9;
  --highlight: rgba(255, 255, 255, 0.94);
  --shadow: 0 12px 40px rgba(31, 61, 42, 0.065);
}
:root[data-theme='dark'] body {
  background: radial-gradient(ellipse at 88% 8%, #252c27 0, transparent 30%), var(--paper);
}
:root[data-theme='light'] body {
  background: radial-gradient(ellipse at 88% 8%, #e1ece1 0, transparent 30%), var(--paper);
}
:root[data-theme='dark'] .button,
:root[data-theme='dark'] body.family-site button:not(.secondary):not(.text-button) {
  background: var(--action);
  color: #17291d;
}
:root[data-theme='light'] .button,
:root[data-theme='light'] body.family-site button:not(.secondary):not(.text-button) {
  background: var(--action);
  color: #f8fcf7;
}
:root[data-theme='dark'] .button:hover {
  background: #cce3ce;
}
:root[data-theme='light'] .button:hover {
  background: #395944;
}
:root[data-theme='dark'] .example[data-state='uncertain'] .example-outcome {
  color: #f0cf91;
}
:root[data-theme='light'] .example[data-state='uncertain'] .example-outcome {
  color: #765118;
}
:root[data-theme='dark'] .badge.warm,
:root[data-theme='dark'] .today-person[data-availability='missing'] .person-state,
:root[data-theme='dark'] .today-person[data-availability='suspended'] .person-state {
  background: #463a21;
  color: #f0cf91;
}
:root[data-theme='light'] .badge.warm,
:root[data-theme='light'] .today-person[data-availability='missing'] .person-state,
:root[data-theme='light'] .today-person[data-availability='suspended'] .person-state {
  background: #f8eed5;
  color: #75531b;
}
:root[data-theme='dark'] .danger,
:root[data-theme='dark'] .status.error {
  color: #f4b9ad;
}
:root[data-theme='light'] .danger,
:root[data-theme='light'] .status.error {
  color: #963b35;
}
:root[data-theme='dark'] input,
:root[data-theme='dark'] textarea,
:root[data-theme='dark'] select {
  border-color: var(--line);
}
@media (prefers-reduced-transparency: reduce) {
  :root:root {
    --glass: var(--solid);
  }
  header,
  .site-header,
  .page-nav,
  .save-bar,
  dialog::backdrop {
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }
}
@media (prefers-contrast: more) {
  :root:root {
    --glass: var(--solid);
    --muted: var(--ink);
  }
}

/* Reading preferences chosen in Impostazioni; each is an attribute on <html>. */
:root[data-text='large'] body {
  zoom: 1.1;
}
:root[data-text='larger'] body {
  zoom: 1.2;
}
:root[data-contrast='more'] {
  --ink: #14231a;
  --muted: #37473d;
  --line: #8a998e;
  --glass: #ffffff;
  --solid: #ffffff;
  --highlight: #8a998e;
  --accent: #1f3d2b;
  --focus: #1f3d2b;
  --danger-ink: #742421;
}
@media (prefers-color-scheme: dark) {
  :root[data-contrast='more']:not([data-theme='light']) {
    --ink: #ffffff;
    --muted: #dde1dd;
    --line: #848d86;
    --glass: #1b1e1c;
    --solid: #1b1e1c;
    --highlight: #848d86;
    --accent: #cfe6d3;
    --focus: #d5ecd9;
    --danger-ink: #ffd2c8;
  }
}
:root[data-theme='dark'][data-contrast='more'] {
  --ink: #ffffff;
  --muted: #dde1dd;
  --line: #848d86;
  --glass: #1b1e1c;
  --solid: #1b1e1c;
  --highlight: #848d86;
  --accent: #cfe6d3;
  --focus: #d5ecd9;
  --danger-ink: #ffd2c8;
}
:root[data-contrast='more'] :focus-visible {
  outline-width: 3px;
}
:root[data-motion='reduce'] *,
:root[data-motion='reduce'] *::before,
:root[data-motion='reduce'] *::after {
  animation-duration: 0.01ms !important;
  animation-iteration-count: 1 !important;
  transition-duration: 0.01ms !important;
  scroll-behavior: auto !important;
}
