/* Minimal, typography-first academic style with dark-mode support */

:root{
  --fg:#1f2937;
  --bg:#ffffff;
  --muted:#6b7280;
  --link:#0a66c2;
  --accent:#0ea5e9;
  --card:#f8fafc;
  --border:#e5e7eb;
}

@media (prefers-color-scheme: dark){
  :root{
    --fg:#111;       /* darker text */
    --bg:#f5f5f5;    /* bright background */
    --muted:#555;
    --link:#0366d6;
    --accent:#007acc;
    --card:#ffffff;
    --border:#cccccc;
  }
}

* { box-sizing:border-box; }
html, body { margin:0; padding:0; }
body {
  font-family: system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", Ubuntu, Cantarell, "Fira Sans", "Droid Sans", sans-serif;
  color:var(--fg);
  background:var(--bg);
  line-height:1.65;
}

.container {
  max-width: 880px;
  margin: 0 auto;
  padding: 2.5rem 1.25rem 3rem;
}

.header {
  display:flex; gap:1rem; align-items:flex-end; justify-content:space-between;
  border-bottom:1px solid var(--border); padding-bottom:1rem; margin-bottom:1.5rem;
}
.header .title { margin:0; font-size:1.9rem; letter-spacing:0.2px; }
.header nav a {
  color:var(--link); text-decoration:none; margin-left:1rem; font-weight:600;
}
.header nav a:hover { text-decoration:underline; }

.lead {
  font-size:1.12rem; color:var(--fg);
  background:var(--card); border:1px solid var(--border);
  padding:1rem 1.25rem; border-radius:10px;
}

h2 { 
  margin-top: 2rem; 
  font-size: 1.4rem; 
}

table {
  width: 100%;
  border-collapse: collapse;
  table-layout: auto;
  margin-top: 1rem;
}

table th,
table td {
  border: 1px solid var(--border);
  padding: 0.5rem;
}

table thead th {
  background: var(--card);
  color: var(--fg);
}
h3 { margin-top:1.4rem; font-size:1.18rem; }
p { margin:0.6rem 0; color:var(--fg); }

ul { margin:0.4rem 0 1.2rem 1.2rem; }
li { margin:0.25rem 0; }

.meta { color:var(--muted); font-size:0.95rem; }

.btn {
  display:inline-block; background:var(--accent); color:#001018; font-weight:700;
  padding:0.55rem 0.85rem; border-radius:8px; text-decoration:none; border:1px solid transparent;
}
.btn:hover { filter:brightness(1.05); }
.btn.ghost {
  background:transparent; border:1px solid var(--border); color:var(--link); font-weight:600;
}

.card {
  background:var(--card); border:1px solid var(--border);
  border-radius:10px; padding:1rem; margin:0.75rem 0;
}

.footer {
  margin-top:2rem; padding-top:1rem; border-top:1px solid var(--border); color:var(--muted); font-size:0.95rem;
}
``