/* Shared Vovva brand tokens. Light: white with forest green. Dark: forest green with warm white. */
:root {
  color-scheme: light;
  --bg: #FAFAF7;
  --paper: #FFFFFF;
  --ink: #173D30;
  --muted: #5C7064;
  --green: #1D513C;
  --on-green: #FFFFFF;
  --pale: #ECF1E9;
  --line: #DCE5DC;
  --orange: #A47740;
  --accent: #D3AA77;
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #102C23;
  --paper: #214535;
  --ink: #FAFAF7;
  --muted: #D3DED3;
  --green: #F5F0E5;
  --on-green: #173D30;
  --pale: #2B5140;
  --line: #527564;
  --orange: #D3AA77;
  --accent: #D3AA77;
}
[data-theme="dark"] :is(.sidebar,.composer,.post,.panel,.card,.search,.filter,.join-small,.empty,dialog) { background: var(--paper); }
[data-theme="dark"] .topbar { background: var(--bg); }
[data-theme="dark"] :is(.nav-item,.top-quote,.composer span,.composer>svg,.feed-label,.post-foot button,.attendees,.eyebrow,.right-footer,footer,.quote-panel small,.date-box small) { color: var(--muted); }
[data-theme="dark"] :is(.nav-item.active,.mobile-nav-item.active) { background: var(--pale); color: var(--ink); }
[data-theme="dark"] .nav-item:hover { background: var(--pale); }
[data-theme="dark"] :is(.demo-label,.date-box,.tag,.notice,.quote-panel) { background: var(--pale); color: var(--ink); }
[data-theme="dark"] .btn { background: var(--green); color: var(--on-green); }
[data-theme="dark"] .btn.secondary { background: var(--pale); color: var(--ink); }
[data-theme="dark"] .btn.outline { background: transparent; color: var(--ink); border-color: var(--line); }
[data-theme="dark"] .filter.active { background: var(--green); color: var(--on-green); }
[data-theme="dark"] .mini-profile { background: var(--pale); color: var(--ink); border-color: var(--paper); outline-color: var(--line); }
[data-theme="dark"] .field :is(input,textarea,select) { background: var(--bg); color: var(--ink); border-color: var(--line); }
[data-theme="dark"] ::placeholder { color: var(--muted); opacity: 1; }
[data-theme="dark"] .post-text { color: var(--ink); }
[data-theme="dark"] .post-foot .liked { color: #FFB5A4; }
[data-theme="dark"] .post-foot .liked svg { fill: #FFB5A4; stroke: #FFB5A4; }
[data-theme="dark"] #mobile-nav { background: var(--paper); }
[data-theme="dark"] .mobile-nav-item { color: var(--muted); }
[data-theme="dark"] .mobile-nav-item.active { color: var(--ink); }
[data-theme="dark"] #toast { background: var(--green); color: var(--on-green); }
