/* Round186: a way back to the main Siametrics site from this standalone article.

   The article is published on its own subdomain route, so the masthead brand
   (which jumps to #opening) is not a way off the page. This sits opposite it on
   the right, carried there by the masthead's existing justify-content:space-between.

   Deliberately NOT wrapped in <nav>: edition38.css hides `.masthead nav` outright. */

.smc186-home {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
  padding: 8px 15px;
  border: 1px solid #142e3533;
  border-radius: 999px;
  background: #ffffff5c;
  color: inherit;
  font: 500 14px/1 Geist, Anuphan, sans-serif;
  text-decoration: none;
  transition: color .18s, border-color .18s, background .18s;
}

.smc186-home:hover {
  color: #2a6b56;
  border-color: #2a6b5666;
  background: #ffffffab;
}

.smc186-home svg {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
}

@media (max-width: 700px) {
  .smc186-home { gap: 6px; padding: 7px 12px; font-size: 13px; }
}

/* Narrowest phones: keep the icon, drop the label to the accessibility tree only
   (same clip-path technique as .sr-only in full-story.css). */
@media (max-width: 360px) {
  /* Icon-only, so pad it out to a 44x44 tap target (16px icon + 26px padding + 2px border). */
  .smc186-home { padding: 13px; }
  .smc186-home span {
    position: absolute;
    width: 1px;
    height: 1px;
    clip-path: inset(50%);
    overflow: hidden;
    white-space: nowrap;
  }
}
