/* Local UX polish, Nov 10 2026. Safe visual and nav fixes only. */
:root{
  color-scheme:light;
  --ink:#102b3a;
  --muted:#4d6470;
  --paper:#f6fafb;
  --card:#fff;
  --blue:#126a86;
  --coral:#c65a40;
  --mint:#dff1ec;
  --line:#d8e6e9;
  --shadow:0 20px 60px rgba(20,72,91,.12);
  --button-ink:#fff;
  --surface:#edf3f5;
}
.hero-proof span{color:#7a4e00}
@media(prefers-color-scheme:dark){
  :root{
    color-scheme:dark;
    --ink:#eef5f9;
    --muted:#adc0cd;
    --paper:#0d1824;
    --card:#172737;
    --blue:#86bfd4;
    --coral:#f49a80;
    --mint:#1d3543;
    --line:#344b5e;
    --shadow:0 20px 60px #0005;
    --surface:#142333;
    --button-ink:#0b1c28;
  }
  .hero-proof span{color:#f0c36a}
}
figcaption{font-size:13px;line-height:1.45}
.legal .on-this-page{
  margin:24px 0 8px;
  padding:16px 18px;
  border:1px solid var(--line);
  border-radius:16px;
  background:var(--card,#fff);
  max-width:790px;
}
.legal .on-this-page h2{
  margin:0 0 10px;
  font-size:16px;
  letter-spacing:0;
}
.legal .on-this-page ol{
  margin:0;
  padding-left:20px;
}
.legal .on-this-page li{margin:4px 0}
.legal h2, .legal h3{scroll-margin-top:88px}
.legal h3{font-size:20px;line-height:1.35}
/* Prefer readable section titles without skipping heading level. */
.site-policy .legal h2{font-size:22px;letter-spacing:-.02em;margin-top:32px;line-height:1.3}

.iq-top-download{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:12px 16px;
  margin:8px 0 28px;
  padding:14px 16px;
  border:1px solid var(--line);
  border-radius:16px;
  background:var(--card,#fff);
  max-width:820px;
}
.iq-top-download p{margin:0;font-size:15px;font-weight:650;color:var(--ink);max-width:42ch}
.iq-top-download-actions{display:flex;flex-wrap:wrap;gap:10px}
.iq-top-download-actions a,
.iq-top-download .buttons a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  padding:8px 16px;
  border-radius:12px;
  background:var(--blue);
  color:var(--button-ink,#fff);
  font-weight:750;
  text-decoration:none;
  border:1px solid var(--blue);
}
.iq-top-download-actions a:focus-visible,
.iq-top-download .buttons a:focus-visible{outline:3px solid var(--coral);outline-offset:3px}

.empty button,
.library-tools button{
  color:var(--button-ink,#fff);
  background:var(--blue);
  border-color:var(--blue);
}
.library-tools button{
  background:transparent;
  color:var(--blue);
}
@media(prefers-color-scheme:dark){
  .empty button{
    color:var(--button-ink);
    background:var(--blue);
  }
  .library-tools button{
    background:transparent;
    color:var(--blue);
  }
}

/* Sticky download bar for inner pages (and a consistent fallback on home). */
.mobile-downloads[hidden]{display:none}
@media(max-width:760px){
  .mobile-downloads{
    position:fixed;
    bottom:0;left:0;right:0;
    z-index:12;
    display:flex;
    gap:10px;
    padding:10px 16px calc(10px + env(safe-area-inset-bottom));
    background:color-mix(in srgb, var(--paper) 96%, transparent);
    border-top:1px solid var(--line);
    box-shadow:0 -4px 20px #102b3a14;
  }
  .mobile-downloads a{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:8px;
    min-height:44px;
    flex:1;
    background:var(--blue);
    color:var(--button-ink,#fff);
    border-radius:12px;
    font-size:13px;
    font-weight:750;
    text-decoration:none;
  }
  .mobile-downloads a:focus-visible{outline:3px solid var(--coral);outline-offset:2px}
  body:has(.mobile-downloads:not([hidden])){padding-bottom:84px}
  html:has(.mobile-downloads){scroll-padding-bottom:90px}
}
body:has(input:focus) .mobile-downloads,
body:has(select:focus) .mobile-downloads,
body:has(dialog[open]) .mobile-downloads{display:none}

/* Keep the mobile hero screenshot visible even if older rules hide it. */
@media(max-width:760px){
  .hero-capture{display:block;width:min(220px,62vw);margin:28px auto 0}
}

/* Slightly roomier legal lists */
.legal ol,.legal ul{line-height:1.6}
.legal li{margin:8px 0}

/* Support page */
.support-page .support-card{
  max-width:720px;
  margin:28px 0;
  padding:22px;
  border:1px solid var(--line);
  border-radius:18px;
  background:var(--card,#fff);
}
.support-page .support-card p{color:var(--muted);max-width:60ch}

/* Light mode: keep the closing download card readable (cleanup.css had set a pale background on white text). */
.site-home .download-card{
  background:var(--ink);
  color:#fff;
  border:1px solid var(--ink);
}
.site-home .download-card h2,
.site-home .download-card .download-terms,
.site-home .download-card .download-terms a{color:#fff}
.site-home .download-card .button{
  background:#fff;
  border-color:#fff;
  color:#126a86;
}
@media(prefers-color-scheme:dark){
  .site-home .download-card{
    background:#1b3545;
    border-color:#416376;
    color:var(--ink);
  }
  .site-home .download-card h2{color:var(--ink)}
  .site-home .download-card .download-terms{color:#c2d2dd}
  .site-home .download-card .download-terms a{color:#c4e7f2}
  .site-home .download-card .button{
    background:var(--blue);
    border-color:var(--blue);
    color:var(--button-ink);
  }
}

/* Shared mobile nav: brand on its own row, links wrap cleanly. */
@media(max-width:760px){
  header nav,
  .nav{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    row-gap:4px;
    column-gap:14px;
  }
  header .brand,
  .nav .brand,
  header nav > .brand{
    flex-basis:100%;
  }
  header nav > a:not(.brand),
  .navlinks a{
    min-height:44px;
    display:inline-flex;
    align-items:center;
  }
}