/* ============================================
   BASE STYLES
   Global typography, body, selections, grain
   ============================================ */

body {
  background-color: var(--c-bg-deep);
  color: var(--c-text-body);
  font-family: var(--font-body);
  font-size: var(--fs-base);
  font-weight: var(--fw-regular);
}

/* Grain texture overlay */
body::after {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 9998;
  opacity: 0.045;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E");
  background-repeat: repeat;
  background-size: 256px 256px;
}

/* Headings */
h1, h2, h3, h4 {
  font-family: var(--font-display);
  color: var(--c-text-primary);
  font-weight: var(--fw-semibold);
  line-height: var(--lh-tight);
}

h1 { font-size: var(--fs-hero); }
h2 { font-size: var(--fs-3xl); }
h3 { font-size: var(--fs-xl); }
h4 { font-size: var(--fs-lg); }

/* Links */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
  outline: 2px solid var(--c-violet);
  outline-offset: 2px;
  border-radius: var(--radius-sm);
}

/* Selection */
::selection {
  background: rgba(212, 151, 111, 0.45);
  color: var(--c-text-primary);
}

/* Strong */
strong {
  font-weight: var(--fw-semibold);
  color: var(--c-text-primary);
}

/* Inline link style */
.link {
  color: var(--c-violet);
  text-decoration: underline;
  text-underline-offset: 2px;
  transition: color var(--dur-fast) ease;
  cursor: pointer;
  background: none;
  border: none;
  font: inherit;
  padding: 0;
}
.link:hover {
  color: var(--c-magenta);
}

/* Custom scrollbar — Stealth */
::-webkit-scrollbar {
  width: 10px;
}
::-webkit-scrollbar-track {
  background: #0a0a0a;
}
::-webkit-scrollbar-thumb {
  background: rgba(184, 126, 95, 0.12);
  border-radius: 0;
  transition: background 0.2s ease;
}
::-webkit-scrollbar-thumb:hover {
  background: rgba(184, 126, 95, 0.35);
}
html {
  scrollbar-color: rgba(184, 126, 95, 0.15) #0a0a0a;
  scrollbar-width: thin;
}