/* =====================================================================
   NOT WIKIPEDIA  --  shared stylesheet
   A deliberate near-copy of Wikipedia's (legacy Vector) reading layout:
   serif headings with a thin underline, sans body, right-rail infobox,
   a static "Contents" box, [n] superscript citations, and a small-print
   references list. The identity is changed enough to not be Wikipedia:
   the wordmark, the incomplete-globe logo, and the slate top rule.

   No external fonts or assets -- everything is system fonts + inline SVG.
   ===================================================================== */

:root {
  --nw-link:        #2a4b8d;   /* internal/blue link            */
  --nw-link-red:    #ba1a1a;   /* "article does not exist" link */
  --nw-border:      #a2a9b1;   /* the ubiquitous Wikipedia grey */
  --nw-border-lt:   #c8ccd1;
  --nw-bg-box:      #f8f9fa;   /* infobox / TOC / nav backgrounds */
  --nw-bg-note:     #f8f9fa;
  --nw-text:        #202122;
  --nw-slate:       #36414c;   /* the "not wikipedia" accent    */
  --nw-max:         960px;
}

* { box-sizing: border-box; }

html { font-size: 100%; }

body {
  margin: 0;
  background: #ffffff;
  color: var(--nw-text);
  font-family: -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-size: 14px;
  line-height: 1.6;
  overflow-x: hidden;      /* long URLs / wide diagrams never scroll the page */
}

a        { color: var(--nw-link); text-decoration: none; overflow-wrap: break-word; }
a:hover  { text-decoration: underline; }
a.red    { color: var(--nw-link-red); }
a.ext::after {
  content: "";
  display: inline-block;
  width: 12px; height: 12px;
  margin: 0 1px 0 2px;
  background: no-repeat center/contain
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath fill='%232a4b8d' d='M6 1h5v5H9.5V3.56L4.53 8.53 3.47 7.47 8.44 2.5H6zM2 3h2v1.5H2.5v5h5V8H9v3H1V3z'/%3E%3C/svg%3E");
  vertical-align: baseline;
}

/* ---------------------------------------------------------------------
   PAGE FRAME
   --------------------------------------------------------------------- */
.nw-page {
  max-width: 1180px;
  margin: 0 auto;
  display: flex;
  align-items: flex-start;
}

/* ---- left rail ------------------------------------------------------ */
.nw-rail {
  width: 11.5em;
  flex: 0 0 11.5em;
  padding: 14px 10px 40px;
  font-size: 12.6px;
}
.nw-logo {
  display: block;
  text-align: center;
  margin-bottom: 4px;
}
.nw-logo svg { width: 118px; height: 118px; }
.nw-wordmark {
  text-align: center;
  font-family: Georgia, "Times New Roman", serif;
  line-height: 1.15;
  margin-bottom: 18px;
}
.nw-wordmark .n1 { font-size: 17px; font-weight: 700; letter-spacing: .02em; }
.nw-wordmark .n2 { font-size: 10.5px; color: #54595d; font-style: italic; }

.nw-navbox { margin-bottom: 16px; }
.nw-navbox h3 {
  font-family: -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-size: 11px;
  font-weight: 400;
  color: #54595d;
  border-bottom: 1px solid var(--nw-border-lt);
  padding: 0 0 3px 4px;
  margin: 0 0 4px;
}
.nw-navbox ul { list-style: none; margin: 0; padding: 0; }
.nw-navbox li { padding: 2px 0 2px 8px; }
.nw-navbox li.dim a { color: #72777d; cursor: default; }
.nw-navbox li.dim a:hover { text-decoration: none; }

/* ---- main column ------------------------------------------------- */
.nw-main {
  flex: 1 1 auto;
  min-width: 0;
  border-left: 1px solid var(--nw-border-lt);
  padding: 12px 24px 60px;
}

.nw-tagline {
  font-size: 12.5px;
  color: #54595d;
  margin: -2px 0 0;
}

h1.nw-title {
  font-family: Georgia, "Linux Libertine", "Times New Roman", serif;
  font-weight: 400;
  font-size: 27px;
  line-height: 1.3;
  margin: 4px 0 0;
  padding-bottom: 4px;
  border-bottom: 1px solid var(--nw-border);
}

h2 {
  font-family: Georgia, "Linux Libertine", "Times New Roman", serif;
  font-weight: 400;
  font-size: 21px;
  margin: 26px 0 8px;
  padding-bottom: 3px;
  border-bottom: 1px solid var(--nw-border);
}
h3 { font-size: 15.5px; margin: 18px 0 6px; }

p { margin: 8px 0; }
ul, ol { margin: 8px 0; padding-left: 1.6em; }
li { margin: 3px 0; }

/* ---------------------------------------------------------------------
   HATNOTE  (italic "not to be confused with" line)
   --------------------------------------------------------------------- */
.hatnote {
  font-style: italic;
  padding: 2px 0 2px 1.6em;
  color: #202122;
  margin: 6px 0;
}

/* ---------------------------------------------------------------------
   MAINTENANCE / NOTICE BOX  (mirrors Wikipedia's {{template}} boxes)
   --------------------------------------------------------------------- */
.nw-notice {
  display: flex;
  gap: 12px;
  border: 1px solid var(--nw-border);
  background: var(--nw-bg-note);
  padding: 10px 14px;
  margin: 14px 0;
  font-size: 13px;
}
.nw-notice .ico {
  flex: 0 0 34px;
  font-size: 26px;
  line-height: 1;
  color: var(--nw-slate);
  text-align: center;
}
.nw-notice p { margin: 3px 0; }

/* ---------------------------------------------------------------------
   INFOBOX  (right rail)
   --------------------------------------------------------------------- */
.infobox {
  float: right;
  clear: right;
  width: 22em;
  margin: 4px 0 14px 22px;
  border: 1px solid var(--nw-border);
  background: var(--nw-bg-box);
  font-size: 12.6px;
  line-height: 1.5;
}
.infobox .ib-title {
  background: var(--nw-slate);
  color: #fff;
  text-align: center;
  font-weight: 700;
  padding: 6px 8px;
  font-size: 13.5px;
}
.infobox .ib-fig {
  text-align: center;
  padding: 10px 8px 4px;
}
.infobox .ib-fig svg { max-width: 100%; height: auto; }
.infobox .ib-caption {
  text-align: center;
  padding: 2px 10px 8px;
  color: #54595d;
  font-size: 11.5px;
}
.infobox table { width: 100%; border-collapse: collapse; }
.infobox th, .infobox td {
  text-align: left;
  vertical-align: top;
  padding: 4px 8px;
  border-top: 1px solid var(--nw-border-lt);
}
.infobox th { width: 8.5em; color: #54595d; font-weight: 700; }
.infobox .ib-section {
  background: #eaecf0;
  text-align: center;
  font-weight: 700;
  padding: 3px 8px;
  border-top: 1px solid var(--nw-border-lt);
}

/* ---------------------------------------------------------------------
   TABLE OF CONTENTS  (static, non-functional numbering is fine)
   --------------------------------------------------------------------- */
.nw-toc {
  display: inline-block;
  min-width: 12em;
  border: 1px solid var(--nw-border-lt);
  background: var(--nw-bg-box);
  padding: 8px 18px 10px 10px;
  margin: 14px 0;
  font-size: 13px;
}
.nw-toc .toc-h {
  text-align: center;
  font-weight: 700;
  margin-bottom: 4px;
}
.nw-toc ol { margin: 0; padding-left: 1.4em; list-style: none; counter-reset: toc; }
.nw-toc li { margin: 1px 0; counter-increment: toc; }
.nw-toc a::before { content: counters(toc, ".") "\00a0\00a0"; color: #202122; }

/* ---------------------------------------------------------------------
   FIGURES / DIAGRAMS
   --------------------------------------------------------------------- */
figure.nw-fig {
  border: 1px solid var(--nw-border);
  background: var(--nw-bg-box);
  padding: 10px;
  margin: 14px 0;
  max-width: 460px;
}
figure.nw-fig.center { margin-left: auto; margin-right: auto; }
figure.nw-fig svg, figure.nw-fig img { display: block; max-width: 100%; height: auto; margin: 0 auto; }
figure.nw-fig figcaption {
  font-size: 12px;
  color: #54595d;
  margin-top: 8px;
  line-height: 1.5;
}
.img-placeholder {
  border: 1px dashed var(--nw-border);
  background: repeating-linear-gradient(45deg, #fff, #fff 10px, #f4f5f7 10px, #f4f5f7 20px);
  color: #72777d;
  text-align: center;
  padding: 34px 16px;
  font-size: 12px;
}

/* ---------------------------------------------------------------------
   CITATIONS + REFERENCES
   --------------------------------------------------------------------- */
sup.cite { font-size: 11px; line-height: 1; white-space: nowrap; }
sup.cite a { text-decoration: none; }
sup.cite a::before { content: "["; }
sup.cite a::after  { content: "]"; }

.nw-references { font-size: 12px; line-height: 1.5; }
.nw-references ol { padding-left: 2.2em; }
.nw-references li { margin: 4px 0; }
.nw-references .src-title { font-style: italic; }
.nw-references a, .infobox a, .infobox td { overflow-wrap: anywhere; }

blockquote.nw-quote {
  border-left: 3px solid var(--nw-border);
  margin: 12px 0 12px 8px;
  padding: 2px 0 2px 14px;
  color: #202122;
}
blockquote.nw-quote cite { display: block; font-size: 12px; color: #54595d; margin-top: 4px; }

/* ---------------------------------------------------------------------
   FOOTER
   --------------------------------------------------------------------- */
.nw-foot {
  border-top: 1px solid var(--nw-border);
  margin-top: 34px;
  padding-top: 10px;
  font-size: 11.5px;
  color: #54595d;
}
.nw-foot a { color: #54595d; }

/* ---------------------------------------------------------------------
   MAIN PAGE
   --------------------------------------------------------------------- */
.mainpage-welcome {
  border: 1px solid var(--nw-border-lt);
  background: var(--nw-bg-box);
  text-align: center;
  padding: 14px;
  margin: 12px 0 18px;
}
.mainpage-welcome h1 {
  font-family: Georgia, "Linux Libertine", "Times New Roman", serif;
  font-weight: 400;
  font-size: 24px;
  border: 0;
  margin: 0 0 4px;
}
.entry-list { border: 1px solid var(--nw-border-lt); }
.entry-list .el-head {
  background: #eaecf0;
  font-weight: 700;
  padding: 6px 12px;
  font-family: Georgia, serif;
}
.entry-list .el-row { padding: 10px 12px; border-top: 1px solid var(--nw-border-lt); }
.entry-list .el-row a.title { font-size: 15px; }
.entry-list .el-row .el-desc { color: #54595d; margin-top: 2px; }

/* ---------------------------------------------------------------------
   RESPONSIVE
   --------------------------------------------------------------------- */
@media (max-width: 1000px) {
  .nw-page { flex-direction: column; width: 100%; max-width: 100%; }

  .nw-rail {
    width: 100%; max-width: 100%; flex: none;
    display: grid; grid-template-columns: auto 1fr; column-gap: 12px;
    align-items: center;
    padding: 10px 14px 12px;
    border-bottom: 1px solid var(--nw-border-lt);
    font-size: 13px;
  }
  .nw-logo { grid-row: 1 / span 2; margin: 0; align-self: start; }
  .nw-logo svg { width: 52px; height: 52px; }
  .nw-wordmark { margin: 0; text-align: left; }
  .nw-navbox { grid-column: 1 / -1; margin: 8px 0 0; }
  .nw-navbox h3 { padding-left: 0; }
  .nw-navbox ul { display: flex; flex-wrap: wrap; gap: 2px 14px; }
  .nw-navbox li { padding: 2px 0; }

  .nw-main {
    border-left: 0; padding: 14px 14px 50px;
    width: 100%; max-width: 100%; min-width: 0;
  }
  .infobox { float: none; width: auto; max-width: 100%; margin: 12px 0; }
  .infobox th { width: 7em; }
  figure.nw-fig { max-width: 100%; }
}
