/* Appearance controls and explicit surface colors: photos keep their natural colors. */
.appearance-switch{border:0;padding:0;margin:12px 0;min-width:0}
.appearance-switch legend{font-size:11px;font-weight:600;margin-bottom:8px;color:var(--muted)}
.appearance-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px}
.appearance-options button{min-width:0;min-height:44px;padding:8px 5px;font-size:12px;background:transparent;color:var(--ink);border:1px solid var(--line)}
.appearance-options button[aria-pressed=true]{background:var(--forest);color:white;border-color:var(--forest)}
.sidebar .appearance-switch legend{color:#bdcdbd}.sidebar .appearance-options button{color:#e3ecdf;border-color:#ffffff35}.sidebar .appearance-options button[aria-pressed=true]{background:#dce9d6;color:#193f32}
:root[data-theme=dark]{--forest:#3f4b44;--green:#d3d7dc;--mint:#303236;--cream:#141516;--ink:#e8e9eb;--muted:#adafb4;--line:#3c3e42;--red:#ffac9d;--shadow:0 8px 30px #00000018;--surface:#202123;--raised:#292b2e;color-scheme:dark}
[data-theme=dark] :is(.card,.animal-card,.searchbar,dialog,.app-confirm,.offline-dialog,.subnav a,.mobile-menu:not([hidden]),.bottom-nav,.skip){background:var(--surface);border-color:var(--line)}
[data-theme=dark] :is(.topbar,.mobile-menu-open .topbar){background:#1a1b1d}
[data-theme=dark] .sidebar{background:#1a1b1d}
[data-theme=dark] :is(input,select,textarea){background:#191a1c;border-color:#56585e;color:var(--ink)}
[data-theme=dark] input::placeholder,[data-theme=dark] textarea::placeholder{color:#a0a3a9;opacity:1}
[data-theme=dark] .searchbar input{background:transparent}
[data-theme=dark] :is(.secondary,.offline-status button){background:var(--raised);color:var(--green);border-color:var(--line)}
[data-theme=dark] :is(.secondary:hover,.quiet:hover,.mobile-menu a:hover,.mobile-menu a.active,.topbar #mobile-menu-toggle:hover,.topbar #mobile-menu-toggle[aria-expanded=true]){background:var(--mint)}
[data-theme=dark] :is(.mobile-brand-title,.topbar #mobile-menu-toggle,.mobile-menu a,.bottom-nav a.active,.auth-card .brand,.offline-account-card [data-offline-account-status]){color:var(--green)}
[data-theme=dark] #main-nav a.active{background:#303236;color:#e8e9eb}
[data-theme=dark] .stat:first-child{background:#292b2e;border-color:#4d5156}
[data-theme=dark] :is(.welcome,.full-backup-status,.family .card,.date-box,.animal-thumb,.medication-row,.offline-empty,.offline-main-status,.offline-stats>div,.offline-compare-row){background:var(--raised);border-color:var(--line)}
[data-theme=dark] :is(.welcome p,.welcome .eyebrow,.offline-main-status,.app-confirm p,.confirm-eyebrow,.confirm-close,.footer){color:var(--muted)}
[data-theme=dark] :is(.animal-row,.health-item,.activity-item){border-color:var(--line)}
[data-theme=dark] .pill.female{background:#45322f;color:#efc0b3}
[data-theme=dark] .pill.male{background:#263e4b;color:#b4d6ed}
[data-theme=dark] :is(.pill.overdue,.pill.deleted,.form-error){background:#492d27;color:#ffc0ad;border-color:#8b5344}
[data-theme=dark] :is(.pill.external,.notice,.health-panel-error,.offline-status[data-state=offline],.offline-review-error,.online-only-note,.offline-pending-pill){background:#403822;color:#efda9c;border-color:#786638}
[data-theme=dark] .danger{background:#a34132;color:white}
[data-theme=dark] .danger:hover{background:#bc4b39}
[data-theme=dark] :is(.field-error,.offline-dialog .offline-error){color:#ffb29e}
[data-theme=dark] [aria-invalid=true]{background:#35241f!important;border-color:#ffad94!important}
[data-theme=dark] :is(.confirm-symbol,.app-confirm[data-tone=warning] .confirm-symbol){background:#3d3824;color:#ead69b;border-color:#786638}
[data-theme=dark] .app-confirm[data-tone=danger] .confirm-symbol{background:#492d27;color:#ffc0ad;border-color:#8b5344}
[data-theme=dark] .health-entry.health-card{background:var(--surface)}
[data-theme=dark] :is(.health-entry>summary:hover,.health-entry[open]>summary){background:var(--raised)}
[data-theme=dark] .offline-status{background:#292b2e;color:#d3d7dc;border-color:var(--line)}
[data-theme=dark] .offline-status[data-state=attention]{background:#492d27;color:#ffc0ad;border-color:#8b5344}
[data-theme=dark] .offline-compare-row>div{background:#292b2e}
[data-theme=dark] :is(.offline-compare-row>div:last-child,.offline-use-server){background:#3c3528}
[data-theme=dark] :is(.offline-inherit,.offline-conflict-item small){color:#d0ca9e}
[data-theme=dark] .herd-pedigree{--pg-green:#3f4b44;--pg-mint:#303236;--pg-ink:#e8e9eb;--pg-muted:#adafb4;--pg-line:#3c3e42;--pg-maternal:#6ac1ae;--pg-paternal:#dfb777}
[data-theme=dark] .herd-pedigree :is(.pg-board,.pg-search-field,.pg-search-results,.pg-search-item,.pg-child,.pg-depth select,.pg-toolbar button,.pg-node:not(.pg-node-selected),.pg-node-open,.pg-parent-jump,.pg-no-children,.pg-empty){background:var(--surface);border-color:var(--pg-line)}
[data-theme=dark] .herd-pedigree :is(.pg-toolbar button,.pg-add,.pg-search-field>span,.pg-section-heading>a,.pg-node-open){color:var(--green)}
[data-theme=dark] .herd-pedigree :is(.pg-node-main:hover,.pg-child:hover){background:var(--raised)}
[data-theme=dark] .herd-pedigree .pg-node-selected{background:#3f4b44}
[data-theme=dark] .herd-pedigree .pg-node-selected .pg-node-main:hover{background:#49524c}
[data-theme=dark] .herd-pedigree .pg-viewport{background-color:#17181a;background-image:radial-gradient(#3c3e42 1px,transparent 1px);border-color:var(--line)}
[data-theme=dark] .herd-pedigree :is(.pg-node-role,.pg-node-tag,.pg-node-meta,.pg-node-horn,.pg-board-foot,.pg-board-foot>span:first-child,.pg-accessibility-note){color:#b9bdc4}
[data-theme=dark] .herd-pedigree :is(.pg-pan-hint,.pg-badge,.pg-section-heading h3>span){background:#303236;color:#d8dade;border-color:var(--line)}
[data-theme=dark] .herd-pedigree .pg-selected .pg-badge{background:#ffffff14;color:#e8e9eb}
[data-theme=dark] .herd-pedigree :is(.pg-unknown,.pg-jump-unknown){color:var(--muted)}
[data-theme=dark] .herd-pedigree :is(.pg-message.pg-error,.pg-badge.pg-deleted){background:#492d27;color:#ffc0ad}
/* Neutral navigation and large pedigree surfaces, with semantic status accents. */
[data-theme=dark] .sidebar :is(.appearance-switch legend,.account-link small,.brand-caption,.nav-label){color:var(--muted)}
[data-theme=dark] .sidebar :is(.appearance-options button,.brand,#main-nav a){color:var(--ink)}
[data-theme=dark] .sidebar .appearance-options button[aria-pressed=true]{background:#42464b;color:white}
[data-theme=dark] :is(.avatar,.stat-icon){background:#383b3f;color:var(--ink)}
[data-theme=dark] .stat:first-child :is(.stat-icon,small){color:var(--ink)}
[data-theme=dark] .herd-pedigree .pg-selected{background:#303236}
[data-theme=dark] .herd-pedigree .pg-selected :is(p,.pg-eyebrow,.pg-family-stats>span,.pg-family-stats small,.pg-selected-open){color:#c4c7cc}
[data-theme=dark] .herd-pedigree .pg-family-stats strong{color:#f0f1f3}
[data-theme=dark] .herd-pedigree .pg-node-selected :is(.pg-node-role,.pg-node-tag,.pg-node-meta,.pg-node-horn){color:#d0d3d8}
[data-theme=dark] .herd-pedigree .pg-node-selected .pg-node-open{background:#454a4f}
@media(max-width:560px){
  .detail-heading-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%;gap:8px}
  .detail-heading-actions .button{width:100%;min-width:0;min-height:48px;padding:10px 8px;font-size:12px}
  .form-actions{gap:8px}.form-actions>*{min-width:0;white-space:normal;text-align:center;min-height:48px}
  .bottom-nav a{flex:1;min-width:0;min-height:49px;padding:4px 2px}
  .appearance-card select{font-size:16px}
  .searchbar button{min-height:44px}.searchbar input{font-size:16px}
  .searchbar{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;padding:9px}
  .searchbar input{grid-column:1/-1;width:100%;min-height:46px}
  .searchbar button{width:100%;font-size:12px}
  .animal-row{display:grid;grid-template-columns:48px minmax(0,1fr);gap:5px 11px}
  .animal-row>.animal-thumb{grid-row:1/3;width:48px;height:48px}
  .animal-row>.pill{grid-column:2;justify-self:start}
  .animal-row .row-main strong{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:1.4}
  .animal-row .row-main small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .mobile-menu .appearance-switch{padding:10px 12px 0;margin:6px 0 4px;border-top:1px solid var(--line)}
}