:root {
  --fg: #202122;
  --muted: #54595d;
  --link: #3366cc;
  --link-visited: #6b4ba1;
  --new: #d73333;
  --border: #c8ccd1;
  --bg-alt: #f8f9fa;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans", sans-serif;
  color: var(--fg);
  line-height: 1.6;
  background: #fff;
}

a { color: var(--link); text-decoration: none; }
a:visited { color: var(--link-visited); }
a:hover { text-decoration: underline; }
.new { color: var(--new); }

.site-header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: .5rem 1.5rem;
  padding: .6rem 1.5rem;
  border-bottom: 1px solid var(--border);
  background: var(--bg-alt);
}
.site-header .logo { display: flex; align-items: center; gap: .6rem; font-weight: 600; font-size: 1.15rem; color: var(--fg); }
.site-header .logo img { object-fit: contain; }
.site-header nav { display: flex; flex-wrap: wrap; gap: 1.2rem; }
.site-header nav a { color: var(--fg); }

main { max-width: 64rem; margin: 0 auto; padding: 1rem 1.5rem 2rem; }

.page-title {
  font-family: Georgia, "Linux Libertine", "Times New Roman", serif;
  font-weight: normal;
  font-size: 1.9rem;
  border-bottom: 1px solid var(--border);
  margin: .5rem 0 1rem;
  padding-bottom: .2rem;
}

.content h2 { font-family: Georgia, "Linux Libertine", serif; font-weight: normal; font-size: 1.5rem; border-bottom: 1px solid var(--border); margin: 1.5rem 0 .5rem; }
.content h3 { font-size: 1.2rem; margin: 1.2rem 0 .3rem; }
.content h4, .content h5, .content h6 { font-size: 1rem; margin: 1rem 0 .3rem; }
.content img { max-width: 100%; height: auto; }
.content pre, .content code {
  font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
  font-size: .9em;
  background: var(--bg-alt);
  border: 1px solid #eaecf0;
  border-radius: 2px;
}
.content code { padding: 1px 4px; }
.content pre { padding: .8rem 1rem; overflow-x: auto; white-space: pre-wrap; line-height: 1.4; }
.content table { border-collapse: collapse; max-width: 100%; }
.content blockquote { border-left: 4px solid #eaecf0; margin: 1rem 0; padding: 0 1rem; color: var(--muted); }
.content dl dt { font-weight: bold; }

/* Overflowing tables scroll rather than break the layout */
.mw-parser-output { overflow-wrap: anywhere; }
.mw-parser-output > table, .mw-parser-output .wikitable { display: block; overflow-x: auto; }

.wikitable { background: var(--bg-alt); border: 1px solid #a2a9b1; margin: 1em 0; }
.wikitable > * > tr > th, .wikitable > * > tr > td { border: 1px solid #a2a9b1; padding: .2em .4em; }
.wikitable > * > tr > th { background: #eaecf0; text-align: center; }

/* Table of contents */
.toc, #toc {
  display: inline-block;
  border: 1px solid var(--border);
  background: var(--bg-alt);
  padding: .5rem 1rem;
  font-size: .95em;
  margin: .5rem 0 1rem;
}
.toc h2, #toc h2 { font-size: 1rem; font-weight: bold; border: 0; margin: 0; font-family: inherit; display: inline; }
.toctitle { text-align: center; }
.toc ul { list-style: none; margin: .3rem 0 0; padding-left: 0; }
.toc ul ul { padding-left: 1.2rem; margin: 0; }
.tocnumber { color: var(--fg); padding-right: .4em; }
.toctogglecheckbox, .toctogglespan { display: none; }

/* Images and thumbnails */
.tright, .floatright, figure[typeof~="mw:File/Thumb"].mw-halign-right, .mw-halign-right { float: right; clear: right; margin: .3em 0 1em 1.4em; }
.tleft, .floatleft, .mw-halign-left { float: left; clear: left; margin: .3em 1.4em 1em 0; }
.mw-halign-center { display: table; margin: 0 auto; clear: both; }
figure[typeof~="mw:File/Thumb"], figure[typeof~="mw:File/Frame"], .thumbinner {
  border: 1px solid var(--border);
  background: var(--bg-alt);
  padding: 3px;
  margin-bottom: 1em;
}
figure { margin: 0; }
figure[typeof~="mw:File/Thumb"]:not(.mw-halign-left):not(.mw-halign-center):not(.mw-halign-none) { float: right; clear: right; margin-left: 1.4em; }
figcaption, .thumbcaption { font-size: .88em; padding: .3em; line-height: 1.4; }
.mw-file-element { vertical-align: middle; }

ul.gallery { display: flex; flex-wrap: wrap; gap: .5rem; list-style: none; padding: 0; }
li.gallerybox { width: auto !important; background: var(--bg-alt); border: 1px solid #eaecf0; padding: .3rem; text-align: center; }
li.gallerybox .thumb { width: auto !important; }
.gallerytext { font-size: .85em; }

.file-preview img { max-width: 100%; height: auto; border: 1px solid var(--border); background: repeating-conic-gradient(#eee 0 25%, #fff 0 50%) 0 0 / 16px 16px; }
.file-info { color: var(--muted); }

/* Category member lists */
ul.columns { columns: 18rem; column-gap: 2rem; padding-left: 1.2rem; }
ul.columns li { break-inside: avoid; }

.catlinks { clear: both; margin-top: 2rem; padding: .4rem .8rem; border: 1px solid #a2a9b1; background: var(--bg-alt); font-size: .9em; }
.catlinks ul { display: inline; margin: 0; padding: 0; list-style: none; }
.catlinks li { display: inline; padding: 0 .5em; border-left: 1px solid #a2a9b1; }
.catlinks li:first-child { border-left: 0; }

footer { clear: both; border-top: 1px solid var(--border); color: var(--muted); font-size: .85em; text-align: center; padding: 1rem; }
footer .source { display: inline; margin: 0; }

.mw-empty-elt { display: none; }

@media (max-width: 40rem) {
  .tright, .floatright, .mw-halign-right, figure[typeof~="mw:File/Thumb"] { float: none !important; margin: 1em 0 !important; }
}

/* Thumbnail frame hugs the image; caption wraps to its width */
figure[typeof~="mw:File/Thumb"], figure[typeof~="mw:File/Frame"] { display: table; }
figure[typeof~="mw:File/Thumb"] > figcaption, figure[typeof~="mw:File/Frame"] > figcaption { display: table-caption; caption-side: bottom; background: var(--bg-alt); border: 1px solid var(--border); border-top: 0; margin: 0 -1px; }
