* {margin:0;padding:0;box-sizing:border-box}
:root {
  --bg: #ffffff;
  --bg-alt: #fafafa;
  --text: #222222;
  --text-muted: #555555;
  --border: #e0e0e0;
  --border-alt: #ddd;
  --nav-bg: #f0f0f0;
  --nav-hover: #e0e0e0;
  --code-bg: #f4f4f4;
  --pre-bg: #f4f4f4;
  --link: #2563eb;
  --tag-bg: #eef;
  --tag-text: #555555;
  --banner-sot-bg: #fff3cd;
  --banner-sot-border: #ffc107;
  --banner-side-bg: #d1ecf1;
  --banner-side-border: #0dcaf0;
  --card-border: #eeeeee;
  --recent-border: #eeeeee;
  --footer-border: #e0e0e0;
}
[data-theme="dark"] {
  --bg: #1a1a1a;
  --bg-alt: #252525;
  --text: #e0e0e0;
  --text-muted: #999999;
  --border: #333333;
  --border-alt: #444444;
  --nav-bg: #2a2a2a;
  --nav-hover: #333333;
  --code-bg: #2a2a2a;
  --pre-bg: #2a2a2a;
  --link: #60a5fa;
  --tag-bg: #1e3a5f;
  --tag-text: #93c5fd;
  --banner-sot-bg: #3d3520;
  --banner-sot-border: #ffc107;
  --banner-side-bg: #1a3a42;
  --banner-side-border: #0dcaf0;
  --card-border: #333333;
  --recent-border: #333333;
  --footer-border: #333333;
}
body {font-family:system-ui,-apple-system,sans-serif;line-height:1.6;color:var(--text);max-width:960px;margin:0 auto;padding:0 1rem;background:var(--bg)}
body.dark-toggle {display:flex;align-items:center;gap:.5rem;padding:.25rem .5rem;margin-left:auto;cursor:pointer;border:1px solid var(--border);border-radius:4px;background:var(--bg-alt);color:var(--text)}
body.dark-toggle:hover {background:var(--nav-bg)}
nav {display:flex;flex-wrap:wrap;gap:0.5rem;padding:1rem 0;border-bottom:2px solid var(--border);margin-bottom:1.5rem;align-items:center}
nav a {text-decoration:none;color:var(--text-muted);font-weight:600;font-size:.9rem;padding:.25rem .5rem;border-radius:4px}
nav a:hover {background:var(--nav-bg);color:var(--text)}
nav a:first-child {color:var(--text);font-size:1.05rem}
main {min-height:70vh}
h1 {font-size:1.8rem;margin-bottom:1rem;padding-bottom:.5rem;border-bottom:3px solid var(--text)}
h2 {font-size:1.4rem;margin:1.5rem 0 .75rem}
h3 {font-size:1.15rem;margin:1.2rem 0 .5rem}
p {margin:.5rem 0}
a {color:var(--link)}
a:hover {text-decoration:underline}
ul,ol {margin:.5rem 0 .5rem 1.5rem}
li {margin:.25rem 0}
table {border-collapse:collapse;width:100%;margin:1rem 0}
th,td {border:1px solid var(--border-alt);padding:.4rem .75rem;text-align:left;font-size:.9rem}
th {background:var(--bg-alt);font-weight:600}
code {background:var(--code-bg);padding:.15rem .3rem;border-radius:3px;font-size:.9em}
pre {background:var(--pre-bg);padding:1rem;overflow-x:auto;border-radius:4px;margin:1rem 0}
pre code {background:none;padding:0}
blockquote {border-left:4px solid var(--border-alt);margin:1rem 0;padding:.5rem 1rem;color:var(--text-muted)}
.banner {padding:.75rem 1rem;border-radius:6px;margin:1rem 0;font-weight:600;text-align:center}
.banner-sot {background:var(--banner-sot-bg);border:2px solid var(--banner-sot-border)}
.banner-side {background:var(--banner-side-bg);border:2px solid var(--banner-side-border)}
.broken-link {color:#dc3545;text-decoration:line-through;cursor:not-allowed}
footer {text-align:center;padding:2rem 0 1rem;border-top:1px solid var(--footer-border);color:var(--text-muted);font-size:.85rem;margin-top:3rem}
.card-list {list-style:none;margin:0;padding:0}
.card-list li {padding:.5rem .75rem;border-bottom:1px solid var(--card-border)}
.card-list li:last-child {border-bottom:none}
.card-list a {font-weight:500}
.tag {display:inline-block;background:var(--tag-bg);padding:.1rem .4rem;border-radius:3px;font-size:.8rem;color:var(--tag-text);margin-right:.25rem}
.recent-changes {margin:1.25rem 0;padding:1rem;border:1px solid var(--recent-border);border-radius:8px;background:var(--bg-alt)}
.recent-changes h2 {margin-top:0}
.recent-changes ol {margin-left:1.25rem}
.recent-changes li {padding:.4rem 0;border-bottom:1px solid var(--recent-border)}
.recent-changes li:last-child {border-bottom:none}
.change-date {color:var(--text-muted);font-size:.9em;margin-left:.35rem}
.commit-link {font-size:.85em;margin-left:.35rem}
.change-message {color:var(--text-muted);font-size:.9em}
.breadcrumbs {font-size:.85rem;color:var(--text-muted);margin-bottom:1rem}
.breadcrumbs a {color:var(--text-muted)}
.breadcrumbs a:hover {color:var(--link)}
.word-count {font-size:.8rem;color:var(--text-muted);margin:0}
.word-count span {font-variant-numeric:tabular-nums}
.backlinks {margin-top:2rem;padding:1rem;border:1px solid var(--recent-border);border-radius:8px;background:var(--bg-alt)}
.backlinks h3 {margin-top:0}
.backlinks ul {margin:.5rem 0 .5rem 1.25rem}
.search-nav-link {margin-left:auto}
