/* Approved dearsweetpea branding, 13 October 2026. */
.wordmark { display: block; letter-spacing: normal; line-height: 1; }
.wordmark .brand-logo { display: block; width: 156px; height: auto; max-width: 100%; margin: 0 auto; }
.sidebar .wordmark { flex-shrink: 0; }
.sidebar .tagline { margin-top: 14px; }
.loading .brand-logo { width: 230px; }
@media (max-width: 760px) {
  .sidebar .wordmark .brand-logo { width: 110px; margin: 0; }
}

/* Logo palette: forest ink, sage controls, pale green surfaces and peach highlights. */
body[data-mode="moments"][data-skin="wildflower"] {
  --ex-ink: #203d2c; --ex-bg: #faf8f1; --ex-panel: #fffdf8;
  --ex-tint: #edf0e2; --ex-accent: #f9d5c3; --ex-line: #d6ddc6;
  --ink: #203d2c; --green: #203d2c; --cream: #faf8f1; --paper: #fffdf8; --line: #d6ddc6;
}
body[data-mode="moments"] .button:not(.secondary),
body[data-mode="moments"] .timeline-switch button[aria-pressed="true"] {
  background: #b8c49c; color: #203d2c;
}
body[data-mode="moments"] .button:not(.secondary):hover {
  background: #a9b88a; color: #203d2c;
}
body[data-mode="moments"] .sidebar .nav a.active {
  background: #dce4c9; color: #203d2c;
}
body[data-mode="moments"] .dw-snapshot,
body[data-mode="moments"] .timeline-entry .dw-piece,
body[data-mode="moments"] .timeline-entry .family-feed-memory { background: #fffdf8; }

.butterfly-toggle { position:fixed; right:18px; bottom:18px; z-index:6;
  border:1px solid #c8d2b2; border-radius:24px; padding:9px 14px;
  background:#faf8f1; color:#203d2c; font:12px system-ui,sans-serif; cursor:pointer; }
@media(max-width:760px) { .butterfly-toggle { bottom:86px; right:12px; } }