/* Gear & Home — reusable article components
   Standard root class for new articles: .gh-article
   .gh-solar-article is kept as a legacy alias for the current solar article.
   The WordPress/Blocksy theme owns the page shell, H1, author/meta, disclosure and featured image. */

:where(.gh-article,.gh-solar-article) {
  --gh-ink:#17211b;
  --gh-muted:#5f6962;
  --gh-line:#dfe5df;
  --gh-soft:#f5f7f4;
  --gh-soft-2:#edf2ed;
  --gh-brand:#234f36;
  --gh-brand-dark:#173724;
  --gh-accent:#d79b35;
  --gh-good:#27633c;
  --gh-warn:#84591a;
  --gh-white:#fff;
  --gh-radius:16px;
  --gh-shadow:0 10px 30px rgba(22,44,29,.08);
  width:100%;
  max-width:none;
  color:var(--gh-ink);
  font:17px/1.68 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  overflow-wrap:anywhere;
}

:where(.gh-article,.gh-solar-article) * { box-sizing:border-box; }
:where(.gh-article,.gh-solar-article) img { display:block; max-width:100%; height:auto; }
:where(.gh-article,.gh-solar-article) a { color:var(--gh-brand); text-decoration-thickness:1px; text-underline-offset:3px; }
:where(.gh-article,.gh-solar-article) a:hover { color:var(--gh-brand-dark); }
:where(.gh-article,.gh-solar-article) h2 { margin:54px 0 18px; font-size:clamp(29px,4vw,39px); line-height:1.14; letter-spacing:-.035em; }
:where(.gh-article,.gh-solar-article) h3 { margin:40px 0 12px; font-size:clamp(24px,3vw,30px); line-height:1.18; letter-spacing:-.025em; }
:where(.gh-article,.gh-solar-article) h4 { margin:26px 0 9px; font-size:18px; line-height:1.3; }
:where(.gh-article,.gh-solar-article) p { margin:0 0 20px; }
:where(.gh-article,.gh-solar-article) ul { padding-left:22px; }
:where(.gh-article,.gh-solar-article) section { scroll-margin-top:95px; }

/* Intro / problem framing */
:where(.gh-article,.gh-solar-article) .dek { margin:0 0 22px; color:#404b44; font-size:clamp(19px,2.4vw,23px); line-height:1.48; }
:where(.gh-article,.gh-solar-article) .method-note { margin:22px 0 30px; padding:13px 15px; border:1px solid var(--gh-line); border-radius:12px; background:var(--gh-soft); color:#48534c; font-size:14px; }
:where(.gh-article,.gh-solar-article) .pain-box { margin:28px 0; padding:20px 22px; border:1px solid #d8dfd9; border-left:5px solid var(--gh-accent); border-radius:var(--gh-radius); background:#fbf8f1; }
:where(.gh-article,.gh-solar-article) .pain-box strong:first-child { display:block; margin-bottom:6px; }

/* Quick answer */
:where(.gh-article,.gh-solar-article) .answer-box { margin:32px 0; border:1px solid #b9cbbd; border-left:6px solid var(--gh-brand); background:#f4f8f4; border-radius:var(--gh-radius); padding:23px; }
:where(.gh-article,.gh-solar-article) .eyebrow { display:block; color:var(--gh-brand); text-transform:uppercase; letter-spacing:.11em; font-weight:850; font-size:12px; }
:where(.gh-article,.gh-solar-article) .answer-box h2 { margin:6px 0 8px; font-size:28px; }
:where(.gh-article,.gh-solar-article) .answer-actions,
:where(.gh-article,.gh-solar-article) .product-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:18px; }

/* Buttons */
:where(.gh-article,.gh-solar-article) .btn { min-height:46px; display:inline-flex; align-items:center; justify-content:center; padding:11px 17px; border-radius:10px; border:1px solid var(--gh-brand); font-size:15px; font-weight:800; line-height:1.25; text-align:center; text-decoration:none; }
:where(.gh-article,.gh-solar-article) .btn-primary { background:var(--gh-brand); color:#fff; }
:where(.gh-article,.gh-solar-article) .btn-primary:hover { background:var(--gh-brand-dark); color:#fff; }
:where(.gh-article,.gh-solar-article) .btn-secondary { background:#fff; color:var(--gh-brand); }

/* Quick picks */
:where(.gh-article,.gh-solar-article) .winner-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin:24px 0 38px; }
:where(.gh-article,.gh-solar-article) .winner { border:1px solid var(--gh-line); border-radius:var(--gh-radius); padding:19px; background:#fff; box-shadow:0 8px 24px rgba(22,44,29,.045); }
:where(.gh-article,.gh-solar-article) .winner .label,
:where(.gh-article,.gh-solar-article) .mobile-row .label { color:var(--gh-brand); font-size:12px; font-weight:850; text-transform:uppercase; letter-spacing:.08em; }
:where(.gh-article,.gh-solar-article) .winner h3 { margin:7px 0 6px; font-size:20px; }
:where(.gh-article,.gh-solar-article) .winner p { margin:0; font-size:14px; color:var(--gh-muted); }

/* Desktop comparison table */
:where(.gh-article,.gh-solar-article) .comparison-wrap { margin:24px 0 40px; }
:where(.gh-article,.gh-solar-article) .comparison-desktop { overflow-x:auto; border:1px solid var(--gh-line); border-radius:var(--gh-radius); box-shadow:0 8px 25px rgba(22,44,29,.05); }
:where(.gh-article,.gh-solar-article) table { width:100%; min-width:1060px; border-collapse:separate; border-spacing:0; font-size:14px; }
:where(.gh-article,.gh-solar-article) th,
:where(.gh-article,.gh-solar-article) td { padding:15px 14px; text-align:left; vertical-align:middle; border-bottom:1px solid var(--gh-line); }
:where(.gh-article,.gh-solar-article) th { background:var(--gh-soft); font-size:12px; text-transform:uppercase; letter-spacing:.055em; }
:where(.gh-article,.gh-solar-article) tr:last-child td { border-bottom:0; }
:where(.gh-article,.gh-solar-article) th:first-child,
:where(.gh-article,.gh-solar-article) td:first-child { position:sticky; left:0; z-index:2; min-width:190px; background:#fff; box-shadow:5px 0 10px rgba(19,40,26,.035); }
:where(.gh-article,.gh-solar-article) th:first-child { z-index:3; background:var(--gh-soft); }
:where(.gh-article,.gh-solar-article) .comparison-desktop .btn { white-space:nowrap; }
:where(.gh-article,.gh-solar-article) .mobile-comparison { display:none; }

/* Product cards */
:where(.gh-article,.gh-solar-article) .product-card { margin:34px 0 58px; border:1px solid var(--gh-line); border-radius:20px; overflow:hidden; box-shadow:var(--gh-shadow); background:#fff; scroll-margin-top:95px; }
:where(.gh-article,.gh-solar-article) .product-head { padding:24px 26px 20px; background:linear-gradient(180deg,#f7f9f6,#fff); }
:where(.gh-article,.gh-solar-article) .product-kicker { color:var(--gh-brand); text-transform:uppercase; font-size:12px; font-weight:850; letter-spacing:.09em; }
:where(.gh-article,.gh-solar-article) .product-title-row { display:flex; justify-content:space-between; align-items:flex-start; gap:20px; }
:where(.gh-article,.gh-solar-article) .product-head h3 { margin:7px 0 5px; font-size:31px; }
:where(.gh-article,.gh-solar-article) .pick-badge { flex:0 0 auto; min-width:72px; min-height:72px; border-radius:50%; display:grid; place-items:center; padding:8px; background:var(--gh-brand); color:#fff; font-size:14px; font-weight:900; text-align:center; box-shadow:0 8px 18px rgba(35,79,54,.24); }
:where(.gh-article,.gh-solar-article) .verdict { font-size:18px; color:#3f4942; }
:where(.gh-article,.gh-solar-article) .specs { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); border-top:1px solid var(--gh-line); border-bottom:1px solid var(--gh-line); }
:where(.gh-article,.gh-solar-article) .spec { padding:15px 17px; border-right:1px solid var(--gh-line); }
:where(.gh-article,.gh-solar-article) .spec:last-child { border-right:0; }
:where(.gh-article,.gh-solar-article) .spec span { display:block; font-size:11px; color:var(--gh-muted); text-transform:uppercase; letter-spacing:.06em; font-weight:800; }
:where(.gh-article,.gh-solar-article) .spec strong { display:block; margin-top:3px; font-size:15px; }
:where(.gh-article,.gh-solar-article) .product-body { padding:25px 26px 28px; }
:where(.gh-article,.gh-solar-article) .evidence-strip { margin:0 0 22px; padding:14px 16px; border:1px solid #ceddcf; border-radius:12px; background:#edf4ee; color:#33463a; font-size:14px; }
:where(.gh-article,.gh-solar-article) .pros-cons { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin:24px 0; }
:where(.gh-article,.gh-solar-article) .pc { border-radius:13px; padding:17px; }
:where(.gh-article,.gh-solar-article) .pc.good { background:#eef6ef; border:1px solid #c9ddcd; }
:where(.gh-article,.gh-solar-article) .pc.bad { background:#faf5eb; border:1px solid #e6d4b1; }
:where(.gh-article,.gh-solar-article) .pc h4 { margin:0 0 9px; font-size:15px; }
:where(.gh-article,.gh-solar-article) .pc ul { margin:0; padding:0; list-style:none; }
:where(.gh-article,.gh-solar-article) .pc li { position:relative; padding-left:24px; margin:8px 0; font-size:15px; }
:where(.gh-article,.gh-solar-article) .pc.good li::before { content:"✓"; position:absolute; left:0; color:var(--gh-good); font-weight:900; }
:where(.gh-article,.gh-solar-article) .pc.bad li::before { content:"–"; position:absolute; left:2px; color:var(--gh-warn); font-weight:900; }
:where(.gh-article,.gh-solar-article) .fit-box { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin:22px 0; }
:where(.gh-article,.gh-solar-article) .fit-box > div { padding:15px 17px; border:1px solid var(--gh-line); border-radius:12px; background:var(--gh-soft); font-size:14px; }
:where(.gh-article,.gh-solar-article) .fit-box strong { display:block; margin-bottom:4px; }

/* Editorial figures — product photos are NOT part of the default article template */
:where(.gh-article,.gh-solar-article) .gh-figure { margin:30px 0 42px; }
:where(.gh-article,.gh-solar-article) .gh-figure img { width:100%; border-radius:var(--gh-radius); box-shadow:0 8px 24px rgba(22,44,29,.06); }
:where(.gh-article,.gh-solar-article) .gh-figure figcaption { margin-top:9px; color:var(--gh-muted); font-size:13px; line-height:1.5; }

/* Methodology / attribution */
:where(.gh-article,.gh-solar-article) .methodology { padding:25px; background:var(--gh-soft); border-radius:var(--gh-radius); border:1px solid var(--gh-line); }
:where(.gh-article,.gh-solar-article) .method-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:13px; margin-top:16px; }
:where(.gh-article,.gh-solar-article) .method-item { padding:14px; background:#fff; border-radius:11px; border:1px solid var(--gh-line); }
:where(.gh-article,.gh-solar-article) .method-item strong { display:block; }
:where(.gh-article,.gh-solar-article) .method-item span { font-size:14px; color:var(--gh-muted); }
:where(.gh-article,.gh-solar-article) .source-attribution { margin:18px 0; padding:14px 16px; border-left:4px solid var(--gh-accent); background:#fbf8f1; color:#4e493f; font-size:14px; }

/* FAQ / related */
:where(.gh-article,.gh-solar-article) .faq details { border-top:1px solid var(--gh-line); padding:17px 0; }
:where(.gh-article,.gh-solar-article) .faq details:last-child { border-bottom:1px solid var(--gh-line); }
:where(.gh-article,.gh-solar-article) .faq summary { cursor:pointer; font-weight:800; list-style:none; padding-right:30px; position:relative; }
:where(.gh-article,.gh-solar-article) .faq summary::-webkit-details-marker { display:none; }
:where(.gh-article,.gh-solar-article) .faq summary::after { content:"+"; position:absolute; right:3px; top:-4px; color:var(--gh-brand); font-size:22px; }
:where(.gh-article,.gh-solar-article) .faq details[open] summary::after { content:"−"; }
:where(.gh-article,.gh-solar-article) .faq details p { margin:12px 0 0; color:#465149; }
:where(.gh-article,.gh-solar-article) .related-guides { padding-left:20px; }
:where(.gh-article,.gh-solar-article) .related-guides li { margin:8px 0; }

@media (max-width:720px) {
  :where(.gh-article,.gh-solar-article) { font-size:16px; line-height:1.64; }
  :where(.gh-article,.gh-solar-article) h2 { margin-top:44px; font-size:30px; }
  :where(.gh-article,.gh-solar-article) .dek { font-size:18px; }
  :where(.gh-article,.gh-solar-article) .winner-grid { grid-template-columns:1fr; }
  :where(.gh-article,.gh-solar-article) .comparison-desktop { display:none; }
  :where(.gh-article,.gh-solar-article) .mobile-comparison { display:grid; gap:12px; }
  :where(.gh-article,.gh-solar-article) .mobile-row { border:1px solid var(--gh-line); border-radius:14px; padding:17px; background:#fff; box-shadow:0 6px 18px rgba(22,44,29,.045); }
  :where(.gh-article,.gh-solar-article) .mobile-row .label { font-size:11px; }
  :where(.gh-article,.gh-solar-article) .mobile-row h3 { margin:4px 0 12px; font-size:20px; }
  :where(.gh-article,.gh-solar-article) .mobile-specs { display:grid; grid-template-columns:1fr 1fr; gap:8px 14px; font-size:14px; }
  :where(.gh-article,.gh-solar-article) .mobile-specs span { color:var(--gh-muted); }
  :where(.gh-article,.gh-solar-article) .mobile-row .btn { width:100%; margin-top:14px; }
  :where(.gh-article,.gh-solar-article) .product-card { border-radius:16px; margin-bottom:46px; }
  :where(.gh-article,.gh-solar-article) .product-head { padding:20px 18px 17px; }
  :where(.gh-article,.gh-solar-article) .product-title-row { gap:12px; }
  :where(.gh-article,.gh-solar-article) .product-head h3 { font-size:26px; }
  :where(.gh-article,.gh-solar-article) .pick-badge { min-width:58px; min-height:58px; width:58px; height:58px; font-size:11px; }
  :where(.gh-article,.gh-solar-article) .specs { grid-template-columns:1fr 1fr; }
  :where(.gh-article,.gh-solar-article) .spec { border-bottom:1px solid var(--gh-line); }
  :where(.gh-article,.gh-solar-article) .spec:nth-child(2n) { border-right:0; }
  :where(.gh-article,.gh-solar-article) .spec:nth-last-child(-n+2) { border-bottom:0; }
  :where(.gh-article,.gh-solar-article) .product-body { padding:21px 18px 23px; }
  :where(.gh-article,.gh-solar-article) .pros-cons,
  :where(.gh-article,.gh-solar-article) .fit-box,
  :where(.gh-article,.gh-solar-article) .method-grid { grid-template-columns:1fr; }
  :where(.gh-article,.gh-solar-article) .product-actions .btn { width:100%; }
}

@media (max-width:390px) {
  :where(.gh-article,.gh-solar-article) .mobile-specs { grid-template-columns:1fr; }
  :where(.gh-article,.gh-solar-article) .answer-actions .btn { width:100%; }
}

/* =========================================================
   Gear & Home — Automatic Reading TOC
   Generated by gearandhome-toc.js
   ========================================================= */

.gh-toc {
  --gh-toc-brand:#234f36;
  --gh-toc-line:#dfe5df;
  --gh-toc-muted:#68726b;
  --gh-toc-bg:rgba(255,255,255,.96);

  position:fixed;
  top:112px;
  z-index:80;
  display:none;
  max-height:calc(100vh - 145px);
  overflow-y:auto;
  overscroll-behavior:contain;
  padding:16px 14px 17px;
  border:1px solid var(--gh-toc-line);
  border-radius:14px;
  background:var(--gh-toc-bg);
  box-shadow:
    0 8px 30px rgba(22,44,29,.07),
    0 1px 3px rgba(22,44,29,.04);
  color:#17211b;
  font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  opacity:0;
  transform:translateY(6px);
  transition:opacity .18s ease, transform .18s ease;
}

.gh-toc.is-visible.is-in-article {
  display:block;
  opacity:1;
  transform:none;
}

body.admin-bar .gh-toc {
  top:144px;
  max-height:calc(100vh - 175px);
}

.gh-toc__head {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:13px;
}

.gh-toc__title {
  color:#344039;
  font-size:11px;
  line-height:1.2;
  font-weight:850;
  letter-spacing:.105em;
  text-transform:uppercase;
}

.gh-toc__percent {
  flex:0 0 auto;
  color:var(--gh-toc-brand);
  font-size:11px;
  line-height:1;
  font-weight:850;
}

.gh-toc__list-wrap {
  position:relative;
}

.gh-toc__track {
  position:absolute;
  top:10px;
  bottom:10px;
  left:5px;
  width:2px;
  overflow:hidden;
  border-radius:999px;
  background:#e5eae6;
}

.gh-toc__fill {
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:0;
  border-radius:999px;
  background:var(--gh-toc-brand);
  transition:height .12s linear;
}

.gh-toc__list {
  position:relative;
  z-index:1;
  margin:0;
  padding:0;
  list-style:none;
}

.gh-toc__item {
  position:relative;
  margin:0;
  padding:0 0 0 20px;
}

.gh-toc__item + .gh-toc__item {
  margin-top:3px;
}

.gh-toc__link {
  position:relative;
  display:block;
  padding:6px 4px;
  color:var(--gh-toc-muted);
  font-size:12px;
  line-height:1.3;
  font-weight:650;
  text-decoration:none;
  text-wrap:balance;
  transition:color .15s ease, transform .15s ease;
}

.gh-toc__link:hover {
  color:var(--gh-toc-brand);
}

.gh-toc__link::before {
  content:"";
  position:absolute;
  top:50%;
  left:-18px;
  width:8px;
  height:8px;
  border:2px solid #c9d2cb;
  border-radius:50%;
  background:#fff;
  transform:translateY(-50%);
  transition:
    border-color .15s ease,
    background .15s ease,
    box-shadow .15s ease;
}

.gh-toc__link.is-passed {
  color:#445149;
}

.gh-toc__link.is-passed::before {
  border-color:var(--gh-toc-brand);
  background:var(--gh-toc-brand);
}

.gh-toc__link.is-active {
  color:var(--gh-toc-brand);
  font-weight:850;
  transform:translateX(2px);
}

.gh-toc__link.is-active::before {
  border-color:var(--gh-toc-brand);
  background:#fff;
  box-shadow:
    0 0 0 3px rgba(35,79,54,.14),
    inset 0 0 0 2px #fff;
}

.gh-toc::-webkit-scrollbar {
  width:5px;
}

.gh-toc::-webkit-scrollbar-thumb {
  border-radius:999px;
  background:#ccd5ce;
}

/*
 * The TOC never steals width from the article.
 * JS only enables it when enough free viewport space exists.
 */
@media (max-width:1279px) {
  .gh-toc {
    display:none !important;
  }
}

@media (prefers-reduced-motion:reduce) {
  .gh-toc,
  .gh-toc__fill,
  .gh-toc__link,
  .gh-toc__link::before {
    transition:none !important;
  }
}

/* =========================================================
   Gear & Home — current article hardening + mobile card fix
   Prevents legacy global Additional CSS from shrinking the
   current .gh-article product-card layout.
   ========================================================= */

/* Current article cards must not inherit old global .product-card padding. */
article.gh-article .product-card {
  margin:34px 0 58px;
  padding:0;
  border:1px solid var(--gh-line);
  border-radius:20px;
  overflow:hidden;
  background:#fff;
  box-shadow:var(--gh-shadow);
  scroll-margin-top:95px;
}

/* Current specs must not inherit the old global .specs box styling. */
article.gh-article .specs {
  margin:0;
  padding:0;
  border-radius:0;
  background:transparent;
  font-size:inherit;
}

/* Product headings in the current markup are H2, not H3. */
article.gh-article .product-head h2 {
  margin:7px 0 8px;
  font-size:31px;
  line-height:1.16;
  letter-spacing:-.025em;
  overflow-wrap:normal;
  word-break:normal;
  hyphens:none;
}

article.gh-article .product-title-row > div:first-child {
  min-width:0;
}

article.gh-article .verdict {
  overflow-wrap:normal;
  word-break:normal;
  hyphens:none;
}

@media (max-width:720px) {
  article.gh-article .product-card {
    margin:30px 0 46px;
    padding:0;
    border-radius:16px;
  }

  article.gh-article .product-head {
    padding:20px 18px 18px;
  }

  /*
   * Mobile product header:
   * H2 and badge get separate grid columns, so they can
   * never overlap. The verdict spans the full width below.
   */
  article.gh-article .product-title-row {
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    column-gap:14px;
    row-gap:0;
    align-items:start;
  }

  /*
   * Let the H2 and verdict participate directly in the grid.
   * Markup stays unchanged.
   */
  article.gh-article .product-title-row > div:first-child {
    display:contents;
  }

  article.gh-article .product-head h2 {
    grid-column:1;
    grid-row:1;
    min-width:0;
    min-height:0;
    margin:7px 0 11px;
    padding-right:0;
    font-size:clamp(24px,7vw,28px);
    line-height:1.15;
    letter-spacing:-.025em;
    text-wrap:balance;
    overflow-wrap:normal;
    word-break:normal;
    hyphens:none;
  }

  article.gh-article .pick-badge {
    position:static;
    grid-column:2;
    grid-row:1;
    align-self:start;
    width:58px;
    height:58px;
    min-width:58px;
    min-height:58px;
    margin-top:0;
    padding:6px;
    font-size:11px;
  }

  article.gh-article .verdict {
    grid-column:1 / -1;
    grid-row:2;
    width:100%;
    min-width:0;
    margin:0;
    font-size:17px;
    line-height:1.55;
    overflow-wrap:normal;
    word-break:normal;
    hyphens:none;
  }

  article.gh-article .specs {
    margin:0;
    padding:0;
    border-radius:0;
    background:transparent;
  }
}

@media (max-width:390px) {
  article.gh-article .product-head {
    padding-inline:16px;
  }

  article.gh-article .product-title-row {
    column-gap:10px;
  }

  article.gh-article .product-head h2 {
    padding-right:0;
    font-size:24px;
  }

  article.gh-article .pick-badge {
    width:54px;
    height:54px;
    min-width:54px;
    min-height:54px;
    font-size:10px;
  }

  article.gh-article .verdict {
    font-size:16px;
    line-height:1.52;
  }
}

/* =========================================================
   Gear & Home — mobile/tablet navigation
   Inline collapsed TOC + reading progress + mobile back-to-top
   ========================================================= */

.gh-mobile-toc,
.gh-mobile-progress,
.gh-mobile-backtop {
  display:none;
}

/* Inline TOC for tablets and phones.
   It never floats over content. */
@media (max-width:1279px) {
  article.gh-article .gh-mobile-toc {
    display:block;
    margin:26px 0 34px;
    border:1px solid var(--gh-line);
    border-radius:14px;
    background:#fff;
    box-shadow:0 6px 20px rgba(22,44,29,.045);
    overflow:hidden;
  }

  article.gh-article .gh-mobile-toc summary {
    position:relative;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    min-height:54px;
    padding:14px 48px 14px 16px;
    cursor:pointer;
    list-style:none;
    color:var(--gh-ink);
    font-size:14px;
    line-height:1.3;
    font-weight:850;
    letter-spacing:.015em;
    background:#f7f9f6;
    user-select:none;
  }

  article.gh-article .gh-mobile-toc summary::-webkit-details-marker {
    display:none;
  }

  article.gh-article .gh-mobile-toc summary::after {
    content:"+";
    position:absolute;
    right:17px;
    top:50%;
    color:var(--gh-brand);
    font-size:22px;
    line-height:1;
    font-weight:700;
    transform:translateY(-52%);
  }

  article.gh-article .gh-mobile-toc[open] summary::after {
    content:"−";
  }

  article.gh-article .gh-mobile-toc__meta {
    flex:0 0 auto;
    color:var(--gh-muted);
    font-size:12px;
    font-weight:700;
    letter-spacing:0;
  }

  article.gh-article .gh-mobile-toc__list {
    margin:0;
    padding:8px 16px 13px;
    list-style:none;
    border-top:1px solid var(--gh-line);
  }

  article.gh-article .gh-mobile-toc__item {
    margin:0;
    padding:0;
    border-bottom:1px solid #edf1ed;
  }

  article.gh-article .gh-mobile-toc__item:last-child {
    border-bottom:0;
  }

  article.gh-article .gh-mobile-toc__link {
    position:relative;
    display:block;
    padding:11px 10px 11px 20px;
    color:#526057;
    font-size:14px;
    line-height:1.35;
    font-weight:650;
    text-decoration:none;
  }

  article.gh-article .gh-mobile-toc__link::before {
    content:"";
    position:absolute;
    left:2px;
    top:50%;
    width:7px;
    height:7px;
    border:1.5px solid #c5cec7;
    border-radius:50%;
    background:#fff;
    transform:translateY(-50%);
  }

  article.gh-article .gh-mobile-toc__link.is-passed {
    color:#46544b;
  }

  article.gh-article .gh-mobile-toc__link.is-passed::before {
    border-color:var(--gh-brand);
    background:var(--gh-brand);
  }

  article.gh-article .gh-mobile-toc__link.is-active {
    color:var(--gh-brand);
    font-weight:850;
  }

  article.gh-article .gh-mobile-toc__link.is-active::before {
    border-color:var(--gh-brand);
    background:#fff;
    box-shadow:0 0 0 3px rgba(35,79,54,.12);
  }

  /* Thin reading progress at the very top of the viewport. */
  .gh-mobile-progress {
    position:fixed;
    top:0;
    left:0;
    z-index:99999;
    display:block;
    width:100%;
    height:3px;
    pointer-events:none;
    opacity:0;
    transform:translateY(-3px);
    transition:opacity .18s ease, transform .18s ease;
  }

  .gh-mobile-progress.is-visible {
    opacity:1;
    transform:none;
  }

  .gh-mobile-progress__bar {
    display:block;
    width:0;
    height:100%;
    background:#234f36;
    box-shadow:0 1px 4px rgba(35,79,54,.18);
    transition:width .08s linear;
  }
}

/* Mobile-only back-to-top.
   Desktop keeps Blocksy's existing control. */
@media (max-width:720px) {
  .gh-mobile-backtop {
    position:fixed;
    right:max(16px, env(safe-area-inset-right));
    bottom:max(18px, env(safe-area-inset-bottom));
    z-index:9998;
    display:grid;
    place-items:center;
    width:44px;
    height:44px;
    padding:0;
    border:1px solid rgba(35,79,54,.2);
    border-radius:50%;
    background:rgba(35,79,54,.96);
    color:#fff;
    box-shadow:0 8px 22px rgba(22,44,29,.2);
    font:800 21px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    cursor:pointer;
    opacity:0;
    visibility:hidden;
    transform:translateY(8px);
    transition:
      opacity .18s ease,
      visibility .18s ease,
      transform .18s ease,
      background .18s ease;
    -webkit-tap-highlight-color:transparent;
  }

  .gh-mobile-backtop.is-visible {
    opacity:1;
    visibility:visible;
    transform:none;
  }

  .gh-mobile-backtop:hover,
  .gh-mobile-backtop:focus-visible {
    background:#173724;
  }
}

@media (max-width:390px) {
  article.gh-article .gh-mobile-toc {
    margin:22px 0 30px;
    border-radius:13px;
  }

  article.gh-article .gh-mobile-toc summary {
    min-height:52px;
    padding-left:14px;
  }

  article.gh-article .gh-mobile-toc__list {
    padding-inline:13px;
  }

  .gh-mobile-backtop {
    width:42px;
    height:42px;
    font-size:20px;
  }
}

@media (prefers-reduced-motion:reduce) {
  .gh-mobile-progress,
  .gh-mobile-progress__bar,
  .gh-mobile-backtop {
    transition:none !important;
  }
}