:root{
  --bg: var(--ananke-bg, #0f1115);
  --panel: var(--ananke-panel, #151821);
  --text: var(--ananke-text, #eef3ff);
  --muted: var(--ananke-muted, #a9b4cf);
  --ring: var(--ananke-ring, #2c3756);
  --link: var(--ananke-link, #9ecbff);
  --accent: var(--ananke-accent, #c8a34e);
}

html, body { background: var(--bg); color: var(--text); }

a { color: var(--link); }

header, .site-header, nav.navbar, .ananke-header { background: var(--panel); border-bottom: 1px solid var(--ring); }

footer { color: var(--muted); }

/* Simple card grid used on homepage content */
.grid-cards .cards{ display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 14px; }
.grid-cards .card{ display: block; background: var(--panel); border: 1px solid var(--ring); border-radius: 14px; padding: 16px 14px; text-decoration: none; color: inherit; }
.grid-cards .card:hover{ border-color: #3c4a75; }
.grid-cards .thumb{ aspect-ratio: 3/4; background:#0b0d12; display:grid; place-items:center; border-radius:10px; overflow:hidden; margin-bottom:10px }
.grid-cards .thumb img{ max-width:100%; max-height:100%; display:block }
.grid-cards .muted{ color: var(--muted); }

/* Optional buttons/links accents */
.button, .btn, .ananke-button{ background: #1b1f2a; border:1px solid var(--ring); color:#fff; }
.button:hover, .btn:hover, .ananke-button:hover { border-color: #3c4a75; }
