html { scroll-behavior: smooth; scroll-padding-top: 100px; }
body { overflow-wrap: break-word; }
button, input, a { -webkit-tap-highlight-color: transparent; }
:focus-visible { outline: 3px solid #ad842d; outline-offset: 5px; }
button { min-height: 44px; }
input[type="range"] { min-height: 32px; cursor: pointer; }
input[type="email"]::placeholder { color: #aaa8a2; opacity: 1; }
.vault-photo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.country-flag { width: 30px; height: 20px; flex: 0 0 30px; object-fit: contain; }
.selected-vault-photo { position: relative; min-height: 300px; align-self: stretch; }
.ticker-item { display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; }
.ticker-currency { margin-left: auto; color: oklch(0.72 0.01 85); }
.quote-status { color: oklch(0.85 0.01 85); font-size: 14px; line-height: 1.6; margin: 0; }
.quote-status:empty { display: none; }
.download-request { color: oklch(0.82 0.12 82); padding: 8px 0; }
header > div { flex-wrap: wrap; }
section, form, section div { min-width: 0; }
@media (max-width: 760px) {
  header { position: relative !important; }
  header > div { gap: 18px !important; }
  header nav { order: 3; width: 100%; margin: 0 !important; gap: 12px 20px !important; }
  header > div > div:last-child { margin-left: auto !important; }
  header a[href="#open"] { padding: 11px 12px !important; font-size: 12px !important; }
  section > div[style*="grid"] { gap: 30px !important; }
  #how div[style*="position: sticky"] { position: static !important; }
  .ticker-currency { margin-left: 0; }
  #vaults button { flex-wrap: wrap; }
  #vaults button > span { font-size: 9px !important; }
  #pricing div[style*="align-items: baseline"] { flex-wrap: wrap; }
  #quote-form { padding: 26px 20px !important; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }