/* === BASE + THEME === */

/* === LOADING STATE (hide content until splash ends) === */
body.is-loading header,
body.is-loading .gallery {
  visibility: hidden;
}

body.is-loading {
  overflow: hidden;
}

/* === BASE === */

/* === THEME (light/dark + user customization) === */
:root {
  --av-bg-1: #171a1f;
  --av-bg-2: #0f1115;
  --av-fg: #ffffff;
  --av-icon-hover: rgba(255,255,255,0.10);
}

@media (prefers-color-scheme: light) {
  :root {
    --av-bg-1: #f3f2f7;
    --av-bg-2: #ffffff;
    --av-fg: #111111;
    --av-icon-hover: rgba(0,0,0,0.08);
  }
}

body {
  font-family: 'Trirong', serif;
  font-weight: 300;
  margin: 0;
  min-height: 100vh;
  background: linear-gradient(135deg, var(--av-bg-1), var(--av-bg-2));
  color: var(--av-fg);
}