*, *::before, *::after { box-sizing: border-box; }
body {
  margin: 0;
  font-family: sans-serif;
  font-size: 14px;
  line-height: 1.6;
  color: #202122;
  background: #f6f6f6;
}
a { color: #3366cc; text-decoration: none; }
a:hover { text-decoration: underline; }
a.new { color: #dd3333; }

.shell { display: flex; min-height: 100vh; }
.sidebar {
  width: 176px;
  flex: none;
  padding: 12px;
  font-size: 12px;
}
.sidebar .logo { text-align: center; margin-bottom: 8px; }
.sidebar .logo a { color: inherit; }
.sidebar .logo img.globe { width: 96px; height: 96px; display: block; margin: 0 auto; }
.sidebar .logo .name { font-family: Georgia, 'Times New Roman', serif; font-size: 20px; display: block; }
.sidebar .logo .tag { font-size: 10px; color: #54595d; display: block; }
.sidebar .sidesearch input {
  width: 100%;
  font: inherit;
  font-size: 12px;
  padding: 4px 6px;
  border: 1px solid #a2a9b1;
  background: #fff;
}
.sidebar h6 {
  margin: 14px 0 4px;
  font-size: 12px;
  color: #54595d;
  border-bottom: 1px solid #c8ccd1;
  font-weight: normal;
}
.sidebar ul { margin: 0; padding: 0; list-style: none; }
.sidebar li { margin: 2px 0; }

.page {
  flex: 1;
  min-width: 0;
  background: #fff;
  border: 1px solid #a7d7f9;
  border-right: 0;
  padding: 20px 28px 40px;
}
.page h1 {
  font-family: Georgia, 'Times New Roman', serif;
  font-weight: normal;
  font-size: 28px;
  margin: 0 0 2px;
  border-bottom: 1px solid #a2a9b1;
  padding-bottom: 2px;
}
.page h2 {
  font-family: Georgia, 'Times New Roman', serif;
  font-weight: normal;
  font-size: 22px;
  border-bottom: 1px solid #a2a9b1;
  margin: 22px 0 8px;
}
.page h3 { font-size: 16px; margin: 18px 0 6px; }
.subtitle { color: #54595d; font-size: 12px; margin-bottom: 14px; }
.pagetabs {
  font-size: 13px;
  border-bottom: 1px solid #a2a9b1;
  margin-bottom: 12px;
  padding-bottom: 4px;
  display: flex;
  gap: 12px 16px;
  flex-wrap: wrap;
}

.infobox {
  float: right;
  clear: right;
  width: 272px;
  margin: 0 0 16px 20px;
  border: 1px solid #a2a9b1;
  background: #f8f9fa;
  font-size: 12px;
  padding: 4px;
}
.infobox caption, .infobox .ib-title { font-weight: bold; text-align: center; font-size: 13px; padding: 4px; }
.infobox table { border-collapse: collapse; width: 100%; }
.infobox th { text-align: left; vertical-align: top; padding: 3px 6px 3px 2px; width: 40%; font-weight: bold; }
.infobox td { padding: 3px 2px; }
.infobox figure { margin: 0; text-align: center; }
.infobox figcaption { font-size: 11px; color: #54595d; padding: 2px 4px; }
.infobox img { max-width: 100%; height: auto; cursor: zoom-in; border: 1px solid #c8ccd1; background: #fff; }

figure.thumb { margin: 8px 0 16px; }
figure.thumb img { max-width: 100%; height: auto; cursor: zoom-in; border: 1px solid #c8ccd1; padding: 3px; background: #f8f9fa; }

.blurwrap { position: relative; display: block; overflow: hidden; }
img.blurred { filter: blur(28px); transform: scale(1.06); }
.blurnote {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 12px;
  color: #202122;
  font-size: 12px;
  background: rgba(248, 249, 250, .55);
}

dialog.lightbox { border: 0; padding: 0; background: transparent; max-width: 95vw; max-height: 95vh; max-height: 95dvh; }
dialog.lightbox::backdrop { background: rgba(0,0,0,.82); }
dialog.lightbox img { max-width: 95vw; max-height: 92vh; max-height: 92dvh; display: block; }
dialog.lightbox .hint { color: #eaecf0; font-size: 12px; text-align: center; padding: 4px; }

a.banner { display: block; margin: 0 auto 14px; border: 1px solid #a7d7f9; }
a.banner img { display: block; width: 100%; height: auto; }

.frontgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.frontbox { border: 1px solid #a7d7f9; background: #f5faff; padding: 10px 14px; }
.frontbox.full { grid-column: 1 / -1; }
.frontbox h2 { border: 0; margin: 0 0 6px; font-size: 18px; background: #cedff2; padding: 3px 8px; }
.frontbox.green { border-color: #c6c9b5; background: #f5fffa; }
.frontbox.green h2 { background: #cef2e0; }

form.wiki label { display: block; font-weight: bold; margin: 10px 0 2px; }
form.wiki input[type=text], form.wiki textarea {
  width: 100%;
  font: inherit;
  padding: 5px;
  border: 1px solid #a2a9b1;
}
form.wiki textarea { min-height: 340px; font-family: monospace; font-size: 13px; }
form.wiki button, .btn {
  font: inherit;
  margin-top: 10px;
  padding: 5px 14px;
  border: 1px solid #a2a9b1;
  background: #f8f9fa;
  cursor: pointer;
}
form.wiki button.primary, .btn.primary { background: #36c; border-color: #36c; color: #fff; }
.notice { border: 1px solid #fc3; background: #fef6e7; padding: 8px 12px; margin: 10px 0; }
.notice.ok { border-color: #14866d; background: #d5fdf4; }

.ed-toolbar { display: flex; gap: 4px; margin: 4px 0; flex-wrap: wrap; }
.ed-toolbar button {
  font: inherit;
  font-size: 13px;
  padding: 3px 10px;
  border: 1px solid #a2a9b1;
  background: #f8f9fa;
  cursor: pointer;
}
.ed-toolbar .ed-sep { width: 1px; background: #c8ccd1; margin: 2px 4px; }
.ed-status { display: flex; gap: 14px; font-size: 11px; color: #54595d; margin-top: 2px; }
.ed-restore { font: inherit; font-size: 11px; border: 1px solid #a2a9b1; background: #fef6e7; cursor: pointer; padding: 1px 8px; }
.ed-photo-strip { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 6px; }
.ed-photo-strip figure { margin: 0; text-align: center; font-size: 11px; color: #54595d; }
.ed-photo-strip img { height: 72px; border: 1px solid #a2a9b1; display: block; }
.ed-photo-strip .too-big { color: #d33; }
.ed-help { font-size: 12px; margin: 6px 0; color: #54595d; }
.ed-help code { background: #f8f9fa; border: 1px solid #c8ccd1; padding: 0 3px; }
.ed-preview { border: 1px dashed #a2a9b1; background: #fcfcfc; padding: 8px 14px; margin: 8px 0; }

fieldset.captcha { border: 1px solid #a2a9b1; margin-top: 12px; padding: 8px; }
fieldset.captcha legend { font-weight: bold; font-size: 13px; padding: 0 4px; }
.captcha-tiles { display: flex; gap: 10px; flex-wrap: wrap; }
.captcha-tile { cursor: pointer; text-align: center; }
.captcha-tile img { display: block; border: 2px solid #c8ccd1; }
.captcha-tile input { margin: 4px 0 0; }
.captcha-tile input:checked + img, .captcha-tile:has(input:checked) img { border-color: #36c; }

pre.revdiff {
  white-space: pre-wrap;
  font-size: 12px;
  background: #fff;
  border: 1px solid #a2a9b1;
  padding: 8px;
}
pre.revdiff ins { background: #d5fdf4; text-decoration: none; display: block; }
pre.revdiff del { background: #fee7e6; text-decoration: line-through; display: block; }

table.list { border-collapse: collapse; width: 100%; font-size: 13px; }
table.list th, table.list td { border: 1px solid #a2a9b1; padding: 5px 8px; text-align: left; vertical-align: top; }
table.list th { background: #eaecf0; }
pre.subbody { white-space: pre-wrap; max-height: 240px; overflow: auto; background: #f8f9fa; border: 1px solid #c8ccd1; padding: 6px; font-size: 12px; }

footer.sitefoot { font-size: 11px; color: #54595d; padding: 10px 28px; }

/* Tablets and narrow laptops: slimmer chrome, same two-pane shell. */
@media (max-width: 1024px) {
  .sidebar { width: 148px; }
  .page { padding: 16px 18px 32px; }
  .infobox { width: 236px; margin-left: 14px; }
}

/* Phones and small tablets: single column, touch-sized targets. */
@media (max-width: 720px) {
  .shell { display: block; }
  .sidebar { width: auto; display: flex; align-items: center; gap: 10px 12px; flex-wrap: wrap; padding: 10px 12px; }
  .sidebar .logo img.globe { width: 40px; height: 40px; }
  .sidebar h6 { display: none; }
  .sidebar .sidesearch { flex: 1 1 140px; order: 2; }
  .sidebar ul { display: flex; gap: 8px 12px; flex-wrap: wrap; }
  .sidebar li a { display: inline-block; padding: 4px 2px; }
  .page { border-right: 1px solid #a7d7f9; padding: 14px; }
  .page h1 { font-size: 24px; }
  .infobox { float: none; width: auto; margin: 0 0 14px; }
  .frontgrid { grid-template-columns: 1fr; }
  .frontgrid ul[style*="columns"] { columns: 1 !important; }
  table.list { display: block; overflow-x: auto; white-space: nowrap; }
  .captcha-tiles { gap: 8px; }
  .captcha-tile img { width: min(120px, 21vw); height: auto; }
  .ed-toolbar button { padding: 7px 12px; }
  form.wiki button, .btn { padding: 9px 16px; }
}

/* Touch devices regardless of width: 16px fields stop mobile browsers from
   zooming the page on focus; larger radio targets on the captcha. */
@media (pointer: coarse) {
  form.wiki input[type=text], form.wiki input[type=password], form.wiki textarea, .sidebar .sidesearch input {
    font-size: 16px;
  }
  .captcha-tile input { width: 20px; height: 20px; }
  .ed-toolbar button { min-height: 38px; }
}

/* Very small phones: keep the grid of four captcha tiles on screen. */
@media (max-width: 400px) {
  .page { padding: 10px; }
  .captcha-tile img { width: 20vw; }
  .pagetabs span[style*="margin-left"] { margin-left: 0 !important; }
}