:root {
  /* Accent (overridden by JS on load) */
  --accent: #333399;
  --accent-rgb: 51, 51, 153;

  /* Light theme */
  --bg: #fcfcfd;
  --text: #111827;
  --muted: #4b5563;
  --card: #ffffff;
  --border: rgba(17, 24, 39, 0.10);
}

/* Dark mode */
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #0b0f19;
    --text: #e5e7eb;
    --muted: #a1a1aa;
    --card: rgba(255, 255, 255, 0.04);
    --border: rgba(255, 255, 255, 0.12);
  }
}

/* Base */
html {
  background: var(--bg);
}

body {
  background: var(--bg);
  color: var(--text);
  font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial;
  line-height: 1.6;
}

/* Typography */
.title,
h1, h2, h3 {
  color: var(--text);
  letter-spacing: -0.02em;
}

.subtitle,
p,
li,
.content,
.has-text-grey,
.has-text-grey-light {
  color: var(--muted);
}

/* Links */
a {
  color: var(--accent);
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}

/* Containers */
.container {
  max-width: 860px !important;
  overflow-wrap: anywhere;
}

/* Cards */
.box {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 14px;
  box-shadow: none;
}

/* Buttons */
.button.is-link {
  background-color: var(--accent) !important;
  border-color: var(--accent) !important;
}

.button.is-link.is-light {
  color: var(--accent) !important;
  background-color: rgba(var(--accent-rgb), 0.12) !important;
  border-color: rgba(var(--accent-rgb), 0.25) !important;
}

.button.is-black.is-light {
  background: rgba(17, 24, 39, 0.06);
  color: var(--text);
}

@media (prefers-color-scheme: dark) {
  .button.is-black.is-light {
    background: rgba(255, 255, 255, 0.08);
  }
}

/* Inline code */
code {
  background: rgba(17, 24, 39, 0.06);
  padding: 0.15em 0.35em;
  border-radius: 0.35em;
}

/* Mobile fixes */
html, body {
  max-width: 100%;
  overflow-x: hidden;
}

.title,
.subtitle {
  overflow-wrap: anywhere;
  hyphens: auto;
}

@media (max-width: 480px) {
  .title.is-2 {
    font-size: 2rem;
    line-height: 1.2;
  }

  .subtitle {
    font-size: 1.1rem;
  }
}