:root{
  --bg:#1f1f1f;
  --text:antiquewhite;
  --muted:#9e9e9e;
  --border:#2a2a2a;
}

/* Base */
html,body{height:100%}
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:Georgia,"Times New Roman",Times,serif;
  font-size:18px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;

}

/* Narrow column like eightbit.computer */
/* Constrain + center the main column */
body > header,
body > section,
body > footer{
  width: min(820px, calc(100% - 32px));
  margin-inline: auto;   /* <-- centers the column */
}


/* Headings + divider */

header{ text-align:center; margin:20px 0 8px; }
header h1{
  margin:6px 0 10px;
  font-weight:700;
  font-size:clamp(28px,6vw,44px);
  letter-spacing:.2px;
}
header::after{
  content:"";
  display:block;
  height:1px;
  background:var(--border);
  margin:12px auto 0;
}

h2{ margin:18px 0 6px; }
h3{ margin:12px 0 4px; font-size:1.05rem; }
p{ margin:0 0 .9em; }
small,.small{ font-size:.85rem; color:var(--muted); }

ul{ margin:.2em 0 1em 1.2em; padding:0; }
li{ margin:.3em 0; }

/* Bracket links — keep your colors */
a{ text-decoration:none; white-space:nowrap; }
a:link{ color:lightgreen; }
a:visited{ color:darkcyan; }
a:hover{ color:green; }
a::before{ content:"[ "; }
a::after{ content:" ]"; }
/* Use class="plain" for non-bracket links */
a.plain::before,
a.plain::after{ content:none !important; }

footer{
  margin:10px 0 30px;
  color:var(--muted);
  font-size:.9rem;
}

/* Make your small note look muted without inline styles */
p[style*="font-size:12px"]{ color:var(--muted); }