/* Shared finishing pass: readable labels, consistent focus and reachable navigation. */
html { scroll-padding-top: 1.5rem; scrollbar-color: #728b8d #101720; }
a { text-underline-offset: .22em; }
body[data-theme] :is(a,button,select):focus-visible { outline: 2px solid var(--amber); outline-offset: 5px; }
body[data-theme="archive"] :is(a,button,select):focus-visible { outline-color: #755300; }
body[data-theme] :is(.hero-copy,.header-tools,.platform-list article > div,.command-row > span) { min-width: 0; }
body[data-theme] :is(.button,.download-link) { font-size: .875rem; min-height: 48px; }
body[data-theme] .quick-facts span { font-size: .875rem; line-height: 1.5; }
body[data-theme] .quick-facts strong { font-variant-numeric: tabular-nums; }
body[data-theme] .product-shot figcaption { font-size: .8125rem; line-height: 1.65; }
body[data-theme] .shot-label { font-size: .8125rem; line-height: 1.5; flex-wrap: wrap; }
body[data-theme] .section-heading > p:last-child { text-wrap: pretty; }
body[data-theme] .brew-command { width: 100%; min-height: 56px; justify-content: flex-start; }
body[data-theme] .brew-command .copy-label { margin-left: auto; min-width: 3.5rem; text-align: right; font-size: .875rem; }
body[data-theme="archive"] .install-label { color: #49534d; }
body[data-theme="archive"] .theme-picker > span { color: #49534d; }
body[data-theme] .command-row kbd { display: inline-block; margin-block: .15rem; }
body[data-theme] .command-row > span { overflow-wrap: anywhere; }
body[data-theme] .download-link { white-space: nowrap; }
body[data-theme="pro"] h1 { font-size: clamp(3.25rem,6vw,6rem); }
body[data-theme="pro"] .hero { padding-block: clamp(3.5rem,6vw,6rem); }
body[data-theme="pro"] .section-shell { padding-block: clamp(3.5rem,6vw,6rem); }
body[data-theme="pro"] .section-heading { margin-bottom: 2.25rem; }
body[data-theme="pro"] .feature-card { padding: clamp(1.5rem,2.7vw,2.5rem); }
body[data-theme="pro"] .eyebrow { display: none; }
@media (max-width: 1100px) {
  body[data-theme] .site-header { height: auto; grid-template-columns: auto minmax(0,1fr); padding-block: .9rem; gap: .75rem; }
  body[data-theme] .site-header nav { display: flex; grid-column: 1 / -1; grid-row: 2; justify-content: flex-start; gap: 1.5rem; overflow-x: auto; max-width: 100%; scrollbar-width: thin; padding-block: .25rem; }
  body[data-theme] .site-header nav a { display: inline-flex; align-items: center; min-height: 44px; flex: 0 0 auto; font-size: .875rem; }
  body[data-theme] .header-tools { grid-column: 2; grid-row: 1; }
  body[data-theme] .hero { grid-template-columns: minmax(0,1fr); }
}
@media (max-width: 700px) {
  body[data-theme] .quick-facts { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: .5rem; text-align: center; padding-inline: 0; }
  body[data-theme] .quick-facts li { align-items: center; }
  body[data-theme] .quick-facts span { max-width: none; font-size: .75rem; }
  body[data-theme] .command-row:not(.command-head) > span:last-child { display: block; grid-column: 1 / -1; font-size: .875rem; }
  body[data-theme] .hero-actions { display: grid; grid-template-columns: minmax(0,1fr); }
  body[data-theme] .hero-actions .button { width: 100%; }
  body[data-theme] .platform-list article { grid-template-columns: auto minmax(0,1fr); }
  body[data-theme] .platform-list .download-link { grid-column: 1 / -1; justify-content: space-between; }
  body[data-theme] .brew-command { gap: .5rem; padding-inline: .75rem; }
  body[data-theme] .brew-command code { font-size: .8125rem; }
}

body[data-theme="pro"] .marquee { padding-inline: 1rem; }
body[data-theme="pro"] .install-label { letter-spacing: .05em; }

/* Persistent navigation: solid below the top, clear at the top. Sticky positioning
   preserves document flow, so becoming fixed never shifts the hero. */
html { scroll-padding-top: calc(var(--navigation-height, 100px) + 24px); }
body[data-theme] .site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  isolation: isolate;
  width: 100%;
  background: transparent;
  box-shadow: none;
  transition: border-color 300ms ease;
}
body[data-theme] .site-header::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  border-radius: 0 0 12px 12px;
  background: var(--paper);
  -webkit-backdrop-filter: blur(18px) saturate(120%);
  backdrop-filter: blur(18px) saturate(120%);
  box-shadow: 0 12px 32px #00000024;
  opacity: 0;
  transform: translateY(-10px);
  transition: opacity 300ms ease, transform 420ms cubic-bezier(.16,1,.3,1);
}
body[data-theme] .site-header.is-scrolled { border-bottom-color: transparent; }
body[data-theme] .site-header.is-scrolled::before {
  opacity: 1;
  transform: translateY(0);
}
body[data-theme] .site-header.is-scrolled { border-bottom-color: var(--line); }

/* The mobile link row trades places with a safe-area-aware bottom dock.
   Header layout remains in the document, preventing scroll-position jumps. */
.mobile-bottom-menu { display: none; }
@media (max-width: 700px) {
  html { scroll-padding-bottom: calc(90px + env(safe-area-inset-bottom, 0px)); }
  body[data-theme] { padding-bottom: calc(84px + env(safe-area-inset-bottom, 0px)); }
  body[data-theme] .site-header { position: relative; }
  body[data-theme] .site-header nav {
    opacity: 1;
    transform: translateY(0);
    transition: opacity 480ms cubic-bezier(.22,1,.36,1), transform 600ms cubic-bezier(.22,1,.36,1);
  }
  body[data-theme].mobile-menu-docked .site-header nav {
    opacity: 0;
    transform: translateY(-16px);
    pointer-events: none;
  }
  body[data-theme] .mobile-bottom-menu {
    display: flex;
    position: fixed;
    z-index: 60;
    inset: auto 10px calc(10px + env(safe-area-inset-bottom, 0px));
    align-items: center;
    justify-content: space-around;
    gap: 2px;
    padding: 6px;
    border: 1px solid var(--line);
    border-radius: 16px;
    color: var(--ink);
    background: var(--paper);
    box-shadow: 0 10px 32px #00000030;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(calc(100% + 24px + env(safe-area-inset-bottom, 0px))) scale(.97);
    transition: opacity 450ms cubic-bezier(.22,1,.36,1), transform 650ms cubic-bezier(.22,1,.36,1), visibility 650ms;
  }
  body[data-theme].mobile-menu-docked .mobile-bottom-menu {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0) scale(1);
    transition-delay: 100ms;
  }
  body[data-theme] .mobile-bottom-menu a {
    display: inline-flex;
    min-height: 46px;
    min-width: 0;
    flex: 1 1 auto;
    align-items: center;
    justify-content: center;
    border-radius: 9px;
    padding: 6px 3px;
    font: 600 .75rem/1.4 var(--sans);
    text-decoration: none;
    white-space: nowrap;
  }
  body[data-theme] .mobile-bottom-menu a:is(:hover,:focus-visible) {
    background: color-mix(in srgb, var(--ink) 10%, var(--paper));
  }
  body[data-theme] .mobile-bottom-menu a:focus-visible { outline-offset: -2px; }
  body[data-theme="cyberpunk"] .mobile-bottom-menu { border-color: #b98aff; }
}