/* Geeks to Go blog archive. Mirrors the forum's XenForo "Familiar Blue" style
   (values read from the live forum's computed styles, 2026-10-24). Mobile first. */
:root {
  --text: #32454e;
  --muted: #52646f;
  --backdrop: #e6e6e6;
  --body: #f3f6f8;
  --panel: #fff;
  --header: #07599c;
  --nav: #edf3f7;
  --nav-text: #174d78;
  --border: #c5d0d8;
  --border-light: #d8dfe4;
  --link: #005aa8;
  --content-link: #8a5300;
  --user-cell: #f2f5f7;
  --footer: #064375;
  --footer-text: #edf3f7;
  --width: 1120px;
  color-scheme: light;
}

*, *::before, *::after { box-sizing: border-box; }
html { background: var(--backdrop); -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--backdrop);
  color: var(--text);
  font: 15px/1.4 Tahoma, "Segoe UI", Arial, sans-serif;
  overflow-wrap: anywhere;
}
a { color: var(--link); text-decoration: none; }
a:hover { text-decoration: underline; }
a:focus-visible, .button:focus-visible { outline: 2px solid #174d78; outline-offset: 2px; }
img, iframe, video { max-width: 100%; height: auto; }
iframe { aspect-ratio: 16 / 9; width: 100%; border: 0; }
pre, code { font-family: Consolas, "Courier New", monospace; font-size: 13px; }
pre { overflow-x: auto; background: var(--user-cell); border: 1px solid var(--border-light); padding: 8px; }
table { border-collapse: collapse; display: block; overflow-x: auto; max-width: 100%; }
td, th { border: 1px solid var(--border-light); padding: 4px 6px; }
blockquote { margin: 10px 0; padding: 6px 10px; border-left: 3px solid #f0a020; background: var(--user-cell); }

.inner { max-width: var(--width); margin: 0 auto; padding: 0 10px; }
.skip { position: absolute; left: -999px; top: 0; background: #fff; padding: 8px 12px; z-index: 10; }
.skip:focus { left: 10px; }

/* Header */
.p-header { background: var(--header); }
.p-header .inner { display: flex; align-items: center; min-height: 66px; padding-top: 8px; padding-bottom: 8px; }
.p-logo { display: inline-block; line-height: 0; }
.p-logo img { width: 110px; height: auto; }

/* Tab bar */
.p-nav { background: var(--nav); border-bottom: 1px solid var(--border); }
.p-nav .inner { display: flex; justify-content: space-between; align-items: stretch; gap: 4px; }
.p-nav ul { list-style: none; margin: 0; padding: 0; display: flex; }
.p-tabs { overflow-x: auto; }
.p-tabs a, .p-opposite a { display: block; padding: 10px 10px; color: var(--nav-text); white-space: nowrap; min-height: 44px; }
.p-tabs a { font-weight: 700; }
.p-tabs .is-selected a { background: var(--panel); box-shadow: inset 0 -3px 0 var(--header); border-radius: 2px 2px 0 0; }
.p-tabs a:hover, .p-opposite a:hover { text-decoration: none; background: rgba(255, 255, 255, .6); }
.p-opposite { background: var(--panel); }
.p-opposite li + li a { border-left: 1px solid var(--nav); }
.p-opposite li:not(:last-child) { display: none; }

/* Section links */
.p-section { background: var(--nav); border-bottom: 1px solid var(--border); font-size: 13px; }
.p-section .inner { display: flex; flex-wrap: wrap; gap: 0 16px; }
.p-section a { color: var(--nav-text); display: inline-block; padding: 7px 0; min-height: 30px; }

/* Body */
.p-body .inner { background: var(--body); padding-top: 12px; padding-bottom: 16px; }
.crumbs ol { list-style: none; margin: 0 0 6px; padding: 0; display: flex; flex-wrap: wrap; font-size: 13px; }
.crumbs li + li::before { content: "›"; padding: 0 7px; color: var(--muted); }
.crumbs a[aria-current] { font-weight: 700; }
.p-title { font-size: 21px; font-weight: 400; line-height: 1.25; margin: 0 0 4px; color: var(--text); }
.p-description, .p-meta { color: var(--muted); font-size: 13px; margin: 0 0 12px; }
.p-description p { margin: 0 0 8px; font-size: 15px; color: var(--text); }
.p-meta a { color: var(--muted); }

/* Blocks (blue header bars like the forum's "Community") */
.block { margin: 0 0 16px; }
.block-header { background: var(--header); color: #fff; font-size: 17px; font-weight: 600; margin: 0; padding: 6px 10px; border-radius: 3px 3px 0 0; }
.block-note { margin: 0; padding: 8px 10px; background: var(--panel); border: 1px solid var(--border); border-top: 0; font-size: 13px; color: var(--muted); }

/* Thread-list style post listing */
.struct { list-style: none; margin: 0; padding: 0; background: var(--panel); border: 1px solid var(--border); border-top: 0; border-radius: 0 0 3px 3px; }
.struct-item { display: flex; gap: 10px; padding: 10px; border-top: 1px solid var(--border-light); }
.struct-item:first-child { border-top: 0; }
.struct-main { min-width: 0; }
.struct-title { font-size: 16px; font-weight: 400; margin: 0 0 3px; }
.struct-meta { font-size: 12px; color: var(--muted); margin: 0 0 5px; }
.struct-meta a { color: var(--muted); }
.struct-snippet { margin: 0; }

/* Letter avatars, as the forum shows for members without a picture */
.avatar { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 50%; color: #fff; font-size: 18px; line-height: 1; }
.avatar--0 { background: #b35c1e; } .avatar--1 { background: #4c7a33; } .avatar--2 { background: #2f6f80; } .avatar--3 { background: #87345f; }
.avatar--4 { background: #4357a8; } .avatar--5 { background: #a33c33; } .avatar--6 { background: #2d7a59; } .avatar--7 { background: #75602f; }

/* Message boxes, like forum posts */
.message { display: flex; flex-direction: column; background: var(--panel); border: 1px solid var(--border); border-radius: 3px; margin-bottom: 10px; }
.block .message { border-radius: 0; margin: 0; border-top: 0; }
.message-user { display: flex; align-items: center; gap: 8px; padding: 8px 10px; background: var(--user-cell); border-bottom: 1px solid var(--border-light); }
.message-user .avatar { width: 32px; height: 32px; font-size: 16px; }
.message-name { margin: 0; font-weight: 700; color: var(--link); }
.message-usertitle { margin: 0; font-size: 12px; color: var(--text); }
.message-main { padding: 10px; min-width: 0; flex: 1; }
.message-attribution { display: flex; justify-content: space-between; font-size: 12px; color: var(--muted); border-bottom: 1px solid var(--border-light); padding-bottom: 4px; margin-bottom: 8px; }
.message-anchor { color: var(--muted); }
.bbWrapper { line-height: 1.4; }
.bbWrapper a { color: var(--content-link); text-decoration: underline; }
.bbWrapper p { margin: 0 0 10px; }
.bbWrapper img { border-radius: 2px; }
.reply-to { font-size: 12px; color: var(--muted); }
.message-tags { margin-top: 12px; padding-top: 6px; border-top: 1px solid var(--border-light); font-size: 12px; color: var(--muted); }
.message--page .message-main { padding: 12px 14px; }
.notice { background: #fff8e8; border: 1px solid #ecd9a8; border-radius: 3px; padding: 8px 12px; }
.wp-caption { max-width: 100% !important; margin: 10px 0; }
.wp-caption-text { color: var(--muted); font-size: 13px; margin: 4px 0 0; }
.aligncenter { display: block; margin-left: auto; margin-right: auto; }
.alignright, .alignleft { margin: 4px 0 10px; }
.archive-list { list-style: none; margin: 0 0 12px; padding: 0; }
.archive-list li { padding: 5px 0; border-bottom: 1px solid var(--border-light); }
.archive-list .meta { color: var(--muted); font-size: 12px; }

/* Paging and prev/next */
.pager { display: flex; align-items: center; gap: 10px; margin: 0 0 10px; font-size: 13px; color: var(--muted); }
.pager a { display: inline-block; padding: 6px 10px; background: var(--panel); border: 1px solid var(--border); border-radius: 3px; min-height: 32px; }
.post-nav { display: flex; justify-content: space-between; gap: 10px; margin: 0 0 16px; }
.post-nav a { flex: 1 1 0; max-width: 50%; background: var(--panel); border: 1px solid var(--border); border-radius: 3px; padding: 8px 10px; }
.post-nav a span { display: block; font-size: 12px; color: var(--muted); }
.post-nav a[rel="next"] { text-align: right; }

/* Call to action and buttons */
.button { display: inline-block; background: var(--header); color: #fff; padding: 8px 14px; border-radius: 3px; font-weight: 700; min-height: 36px; text-decoration: none; }
.button:hover { background: #05467c; text-decoration: none; }
.notice-cta { background: var(--panel); border: 1px solid var(--border); border-left: 4px solid var(--header); border-radius: 3px; padding: 10px 12px; margin-top: 4px; }
.notice-cta p { margin: 0 0 8px; }

/* Footer */
.p-footer { background: var(--footer); color: var(--footer-text); font-size: 13px; }
.p-footer .inner { padding-top: 8px; padding-bottom: 14px; }
.p-footer-links { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 0 14px; }
.p-footer-links a { color: #fff; display: inline-block; padding: 6px 0; min-height: 30px; }
.p-footer-copy { text-align: center; font-size: 11px; margin: 10px 0 0; }

@media (min-width: 650px) {
  .p-header .inner { min-height: 102px; }
  .p-logo img { width: 150px; }
  .p-tabs a, .p-opposite a { padding: 10px 15px; }
  .p-opposite li:not(:last-child) { display: block; }
  .p-title { font-size: 24px; }
  .struct-item { padding: 10px 12px; }
  .struct-title { font-size: 17px; }
  .message { flex-direction: row; }
  .message-user { flex-direction: column; justify-content: flex-start; width: 140px; flex: none; padding: 10px; border-bottom: 0; border-right: 1px solid var(--border); text-align: center; }
  .message-user .avatar { width: 64px; height: 64px; font-size: 30px; margin-bottom: 4px; }
  .alignright { float: right; margin: 4px 0 10px 16px; max-width: 50%; }
  .alignleft { float: left; margin: 4px 16px 10px 0; max-width: 50%; }
  .bbWrapper::after { content: ""; display: block; clear: both; }
  .notice-cta { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
  .notice-cta p { margin: 0; }
}