:root{
  --bg: #0b0f16;
  --bg-2: #0f131b;
  --fg: #e8ebf4;
  --muted: #a9b2c7;
  --accent: #ff6b9d; /* matches your site */
  --ring: rgba(255,255,255,0.10);
}

*{ box-sizing: border-box; }

html,body{
  height:100%;
  margin:0;
  color:var(--fg);
  background: var(--bg);
  /* background:
    radial-gradient(900px 600px at 70% 15%, rgba(120,160,255,0.06), transparent 55%),
    radial-gradient(1000px 700px at 20% 80%, rgba(108,255,204,0.05), transparent 60%),
    linear-gradient(135deg, var(--bg), var(--bg-2) 55%, #0a0c11); */
  font: 16px/1.6 system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

.container{
  max-width: 900px;
  margin: 0 auto;
  padding: clamp(20px, 4vw, 40px);
}

.site-header, .site-footer{
  padding: 24px clamp(20px, 4vw, 40px);
}

h1{ margin: 0 0 8px; font-size: clamp(1.6rem, 3vw, 2.2rem); }
h2{ margin: 24px 0 8px; font-size: clamp(1.2rem, 2.2vw, 1.5rem); }
p, li{ color: var(--fg); }
.lead{ color: #d9deee; }

a{ color: var(--accent); text-decoration: none; }
a:hover{ text-decoration: underline; }

details{
  background: rgba(255,255,255,0.03);
  border: 1px solid var(--ring);
  border-radius: 12px;
  padding: 14px 16px;
  margin: 12px 0;
}
summary{ cursor: pointer; }

ul{ padding-left: 20px; }

.backlink{
  margin-top: 24px;
}

.site-footer{
  color: var(--muted);
  border-top: 1px solid var(--ring);
}