/* The same floating-island language as the main header, sized for thumbs. */
:root {
  --mobile-nav-space: 0px;
  --mobile-nav-bottom: max(12px, env(safe-area-inset-bottom, 0px));
  --mobile-nav-ink: #0e2433;
  --mobile-nav-purple: #542192;
  --mobile-nav-paper: #f4f7fa;
}
.mobile-bottom-nav { display: none; }

@media (max-width: 1199px), (max-width: 1366px) and (pointer: coarse) {
  :root { --mobile-nav-space: calc(112px + env(safe-area-inset-bottom, 0px)); }
  html { scroll-padding-bottom: var(--mobile-nav-space); }
  body { padding-bottom: 0; }
  .mf { padding-bottom: var(--mobile-nav-space); }
  .deck:not(:fullscreen) .foot { padding-bottom: calc(var(--mobile-nav-space) + 22px); }
  .deck:not(:fullscreen) { --s: min(max(150px, calc(100svh - 340px - var(--mobile-nav-space))), 75vw); }
  .mobile-bottom-nav {
    position: fixed;
    z-index: 90;
    inset: auto max(12px, env(safe-area-inset-right, 0px)) var(--mobile-nav-bottom) max(12px, env(safe-area-inset-left, 0px));
    display: block;
    width: auto;
    max-width: 570px;
    margin-inline: auto;
    border: 1px solid rgb(255 255 255 / .18);
    border-radius: 27px;
    color: #fff;
    background: radial-gradient(ellipse at 50% 0%, rgb(84 33 146 / .45), transparent 66%), rgb(14 36 51 / .96);
    box-shadow: 0 18px 50px -14px rgb(14 36 51 / .48), inset 0 1px 0 rgb(255 255 255 / .07);
    backdrop-filter: blur(22px) saturate(1.3);
    -webkit-backdrop-filter: blur(22px) saturate(1.3);
    font-family: 'Instrument Sans', system-ui, sans-serif;
    isolation: isolate;
  }
  .mobile-bottom-nav *, .mobile-bottom-nav *::before, .mobile-bottom-nav *::after { box-sizing: border-box; }
  .mobile-nav-items {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    align-items: end;
    gap: 8px;
    list-style: none;
    margin: 0;
    padding: 7px 10px 8px;
  }
  .mobile-nav-items > li { min-width: 0; }
  .mobile-nav-link {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    gap: 3px;
    min-width: 44px;
    min-height: 58px;
    padding: 2px 0 3px;
    border-radius: 17px;
    color: #d4dce8;
    text-decoration: none;
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
    transition: color .2s, background .2s;
  }
  .mobile-nav-icon { display: grid; place-items: center; width: 40px; height: 32px; border-radius: 12px; transition: background .2s, transform .2s; }
  .mobile-nav-link svg { display: block; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
  .mobile-nav-caption { display: block; max-width: 100%; font: 600 11px/1.35 'Instrument Sans', system-ui, sans-serif; white-space: nowrap; }
  .mobile-nav-link[aria-current] { color: #fff; }
  .mobile-nav-link[aria-current] .mobile-nav-icon { color: #fff; background: rgb(174 123 234 / .28); box-shadow: inset 0 0 0 1px rgb(213 184 250 / .3); }
  .mobile-nav-link[aria-current] .mobile-nav-caption::after { content: ''; display: block; width: 12px; height: 2px; margin: 3px auto -5px; border-radius: 2px; background: #d5b8fa; }
  .mobile-nav-primary { position: relative; }
  .mobile-nav-load { padding-top: 0; color: #fff; }
  .mobile-nav-primary-icon {
    position: absolute;
    bottom: 23px;
    display: grid;
    place-items: center;
    width: 66px;
    height: 66px;
    border: 5px solid var(--mobile-nav-paper);
    border-radius: 23px;
    color: #fff;
    background: radial-gradient(circle at 92% 0%, rgb(197 10 56 / .5), transparent 65%), linear-gradient(145deg, #7836b9, var(--mobile-nav-purple));
    box-shadow: 0 8px 18px -8px rgb(84 33 146 / .8), inset 0 1px 0 rgb(255 255 255 / .25);
    transform: rotate(-6deg);
    transition: transform .24s var(--ease, ease), box-shadow .24s;
  }
  .mobile-nav-primary-icon svg { width: 30px; height: 30px; transform: rotate(6deg); stroke-width: 1.6; }
  .mobile-nav-primary-icon .mobile-nav-bolt { fill: #fff; stroke-width: .7; }
  .mobile-nav-load .mobile-nav-caption { font-weight: 700; }
  .mobile-nav-load[aria-current] .mobile-nav-primary-icon { box-shadow: 0 0 0 3px #c7a0ef, 0 8px 20px -8px rgb(84 33 146 / .8); }
  .mobile-nav-link:focus-visible { outline: 3px solid #d5b8fa; outline-offset: 3px; color: #fff; }
  .mobile-nav-link:active .mobile-nav-icon { transform: scale(.92); }
  .mobile-nav-load:active .mobile-nav-primary-icon { transform: rotate(0) scale(.94); }
  .mobile-nav-tooltip {
    position: absolute;
    bottom: calc(100% + 15px);
    left: 50%;
    z-index: 2;
    padding: 8px 11px;
    border: 1px solid rgb(255 255 255 / .18);
    border-radius: 10px;
    color: #fff;
    background: var(--mobile-nav-ink);
    box-shadow: 0 7px 20px rgb(14 36 51 / .2);
    font: 600 12px/1.3 'Instrument Sans', system-ui, sans-serif;
    white-space: nowrap;
    pointer-events: none;
    opacity: 0;
    visibility: hidden;
    transform: translate(-50%, 5px);
    transition: opacity .18s, transform .18s, visibility .18s;
  }
  .mobile-nav-tooltip::after { content: ''; position: absolute; top: 100%; left: calc(50% - 4px); border: 4px solid transparent; border-top-color: var(--mobile-nav-ink); }
  .mobile-nav-load .mobile-nav-tooltip { bottom: 98px; }
  .mobile-nav-link:focus-visible .mobile-nav-tooltip { opacity: 1; visibility: visible; transform: translate(-50%, 0); }
  .mobile-bottom-nav.tooltips-dismissed .mobile-nav-link .mobile-nav-tooltip { opacity: 0; visibility: hidden; transition: none; }
  body:has(.hdr.menu) .mobile-bottom-nav, body.mobile-nav-keyboard .mobile-bottom-nav { visibility: hidden; pointer-events: none; }

  /* Keep the existing comparison tray and support dock clear of the navigation. */
  #cbar.cbar { bottom: calc(var(--mobile-nav-space) + 14px); left: 12px; right: 12px; max-width: 720px; margin-inline: auto; border-radius: 20px; }
  body:has(.hdr.menu) #product-help-dock { visibility: hidden; pointer-events: none; }
  #product-action-status { bottom: calc(var(--mobile-nav-space) + 16px); }
  #toast { bottom: calc(var(--mobile-nav-space) + 16px); }
  body.has-bar .toast { bottom: calc(var(--mobile-nav-space) + 160px); }
}

@media (hover: hover) and (max-width: 1199px), (hover: hover) and (max-width: 1366px) and (pointer: coarse) {
  .mobile-nav-link:hover { color: #fff; background: rgb(255 255 255 / .05); }
  .mobile-nav-link:hover .mobile-nav-icon { transform: translateY(-2px); }
  .mobile-nav-load:hover .mobile-nav-primary-icon { transform: rotate(0) translateY(-3px); }
  .mobile-nav-link:hover .mobile-nav-tooltip { opacity: 1; visibility: visible; transform: translate(-50%, 0); }
}
@media (prefers-reduced-motion: reduce) {
  .mobile-bottom-nav *, .mobile-bottom-nav *::before, .mobile-bottom-nav *::after { transition: none; }
}
@media print { :root { --mobile-nav-space: 0px; } .mobile-bottom-nav { display: none; } body { padding-bottom: 0; } }

@media(min-width:821px){.deck:not(:fullscreen){--s:min(44vw,600px)}}