/* The light brand: morning light, real landscapes, the glass mark standing in
   them, dark ink type. Loaded after site.css on pages that set
   <html data-theme="light">, and it only swaps tokens and the few rules that
   hard-code the dark look. Fraunces for headlines, Inter Tight for the rest. */
@font-face { font-family: Fraunces; src: url(/assets/fonts/fraunces.woff2) format('woff2'); font-weight: 300 500; font-display: swap; }
@font-face { font-family: 'Inter Tight'; src: url(/assets/fonts/inter-tight.woff2) format('woff2'); font-weight: 400 600; font-display: swap; }

:root[data-theme="light"] {
  color-scheme: light;
  --bg: #f3f1ea;
  --bg-2: #ebe8df;
  --panel: #faf8f3;
  --panel-2: #f0ede5;
  --line: rgba(31, 43, 39, 0.1);
  --line-2: rgba(31, 43, 39, 0.18);
  --text: #1f2b27;
  --body: #3d4a45;
  --muted: #5b6a64;
  --faint: #8a958f;
  /* The accent: deep sage for text, the pale mint of the mark kept for glows. */
  --mint: #2f6b55;
  --mint-ink: #f6f4ee;
  --mist: #c4ecd9;
  --warn: #9a6b12;
  --err: #b24a4a;
  --veil: 243, 241, 234;
  --glow: 47, 107, 85;
  --hair: 31, 43, 39;
  --glass: 250, 248, 243;
  --scrim: 200, 197, 188;
  --tile: #faf8f3;
  --display: Fraunces, Georgia, serif;
  --sans: 'Inter Tight', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
}

:root[data-theme="light"] h1,
:root[data-theme="light"] h2 { font-weight: 300; letter-spacing: -0.035em; line-height: 1.06; font-optical-sizing: auto; }
:root[data-theme="light"] ::selection { background: var(--mist); color: var(--text); }

/* Buttons: an ink pill, and a hairline ghost. */
:root[data-theme="light"] .btn-primary { background: var(--text); color: var(--mint-ink); }
:root[data-theme="light"] .btn-primary:hover { background: #33433d; }
:root[data-theme="light"] .btn-ghost:hover { border-color: var(--text); }

/* Nav: frosted cream, the ink mark. */
:root[data-theme="light"] .nav { background: rgba(var(--veil), 0.74); }
:root[data-theme="light"] .brand { font-size: 1.15rem; letter-spacing: -0.03em; }
:root[data-theme="light"] .brand img, :root[data-theme="light"] .chat-empty img { mix-blend-mode: normal; }

/* Chain marks are drawn light grey for dark tiles: ink them on the cream one. */
:root[data-theme="light"] .rail-mark img:not(.arc) { filter: brightness(0.2); }
:root[data-theme="light"] .rail-mark img.arc { filter: grayscale(1) contrast(4) invert(1) brightness(0.35); mix-blend-mode: multiply; }

/* App sign-in: the scene is already soft, so no extra grading. */
:root[data-theme="light"] .login-bg img, :root[data-theme="light"] .login-bg video { filter: none; object-position: 70% 60%; }
