/* id="instant-assist-estimate-position-final" */

    /* final estimate-form landing position: keep the same visual style, only make opening position consistent */
    #estimateBox,
    #estimateFormShell,
    #estimateFormToggle,
    #estimateForm {
      scroll-margin-top: 0 !important;
    }

    body.estimate-handoff-mode #contact {
      align-items: flex-start !important;
    }

    body.estimate-handoff-mode #estimateBox {
      transform-origin: top center !important;
    }

    body.estimate-positioning-active #estimateBox {
      will-change: transform, opacity, filter;
    }

    @media (max-width: 760px) {
      body.estimate-handoff-mode #contact {
        padding-top: 8px !important;
      }

      body.estimate-handoff-mode .estimate-form-panel.open .estimate-form-panel-inner {
        overflow: visible !important;
      }
    }



    /* final add-device filter panel — soft premium glass dock */
    .device-store,
    body.device-route-mode .device-store {
      margin-top: 2px !important;
    }

    .device-filter-row,
    body.device-route-mode .device-filter-row {
      position: sticky !important;
      top: 50px !important;
      z-index: 14 !important;
      display: inline-flex !important;
      align-items: center !important;
      justify-content: flex-start !important;
      width: auto !important;
      max-width: 100% !important;
      gap: 7px !important;
      overflow-x: auto !important;
      overflow-y: hidden !important;
      padding: 8px !important;
      margin: 2px 0 16px !important;
      border-radius: 999px !important;
      border: 1px solid rgba(var(--dark-rgb), 0.068) !important;
      background:
        radial-gradient(circle at 15% 0%, rgba(255, 255, 255, 0.98), transparent 48%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.86), rgba(247, 247, 245, 0.68)) !important;
      box-shadow:
        0 18px 48px rgba(var(--dark-rgb), 0.075),
        0 7px 18px rgba(var(--dark-rgb), 0.035),
        inset 0 1px 0 rgba(255, 255, 255, 0.96),
        inset 0 -1px 0 rgba(var(--dark-rgb), 0.026) !important;
      backdrop-filter: blur(26px) saturate(1.16) !important;
      -webkit-backdrop-filter: blur(26px) saturate(1.16) !important;
      scrollbar-width: none !important;
      -webkit-overflow-scrolling: touch !important;
      transform: translateZ(0) !important;
    }

    .device-filter-row::-webkit-scrollbar,
    body.device-route-mode .device-filter-row::-webkit-scrollbar {
      display: none !important;
    }

    .device-filter-row::before,
    body.device-route-mode .device-filter-row::before {
      content: "";
      position: absolute;
      inset: 1px;
      border-radius: inherit;
      pointer-events: none;
      background:
        linear-gradient(135deg, rgba(255,255,255,0.62), transparent 38%, transparent 74%, rgba(var(--dark-rgb),0.016));
      opacity: 0.78;
    }

    .device-filter-chip,
    body.device-route-mode .device-filter-chip {
      position: relative !important;
      z-index: 1 !important;
      min-height: 38px !important;
      padding: 10px 15px !important;
      border-radius: 999px !important;
      border: 1px solid rgba(var(--dark-rgb), 0.055) !important;
      background:
        linear-gradient(180deg, rgba(255,255,255,0.78), rgba(248,248,246,0.58)) !important;
      color: rgba(var(--dark-rgb), 0.62) !important;
      box-shadow:
        inset 0 1px 0 rgba(255,255,255,0.86),
        0 6px 13px rgba(var(--dark-rgb), 0.026) !important;
      outline: none !important;
      text-decoration: none !important;
      transform: translateY(0) scale(1) !important;
      transition:
        color 0.34s ease,
        background 0.44s ease,
        border-color 0.44s ease,
        box-shadow 0.44s ease,
        transform 0.54s cubic-bezier(0.16, 1, 0.3, 1),
        opacity 0.34s ease !important;
      -webkit-tap-highlight-color: transparent !important;
    }

    .device-filter-chip:hover,
    .device-filter-chip:focus-visible,
    body.device-route-mode .device-filter-chip:hover,
    body.device-route-mode .device-filter-chip:focus-visible {
      outline: none !important;
      color: rgba(var(--dark-rgb), 0.9) !important;
      border-color: rgba(var(--dark-rgb), 0.075) !important;
      background:
        linear-gradient(180deg, rgba(255,255,255,0.96), rgba(250,250,248,0.78)) !important;
      box-shadow:
        inset 0 1px 0 rgba(255,255,255,0.96),
        0 10px 22px rgba(var(--dark-rgb), 0.045) !important;
      transform: translateY(-1px) scale(1.002) !important;
    }

    .device-filter-chip.active,
    .device-filter-chip.active:hover,
    .device-filter-chip.active:focus,
    .device-filter-chip.active:focus-visible,
    body.device-route-mode .device-filter-chip.active,
    body.device-route-mode .device-filter-chip.active:hover,
    body.device-route-mode .device-filter-chip.active:focus,
    body.device-route-mode .device-filter-chip.active:focus-visible {
      outline: none !important;
      background: #0b0c0e !important;
      color: #ffffff !important;
      border-color: #0b0c0e !important;
      box-shadow:
        0 12px 26px rgba(var(--dark-rgb), 0.18),
        inset 0 1px 0 rgba(255,255,255,0.12) !important;
      transform: translateY(0) scale(1) !important;
    }

    .device-filter-chip.active::before,
    .device-filter-chip.active::after,
    body.device-route-mode .device-filter-chip.active::before,
    body.device-route-mode .device-filter-chip.active::after {
      display: none !important;
      content: none !important;
    }

    @media (max-width: 760px) {
      .device-filter-row,
      body.device-route-mode .device-filter-row {
        top: 48px !important;
        display: flex !important;
        width: max-content !important;
        max-width: calc(100vw - 24px) !important;
        margin: 2px 0 14px !important;
        padding: 7px !important;
        border-radius: 999px !important;
      }

      .device-filter-chip,
      body.device-route-mode .device-filter-chip {
        min-height: 36px !important;
        padding: 9px 14px !important;
        font-size: 12.5px !important;
      }
    }

    @media (max-width: 420px) {
      .device-filter-row,
      body.device-route-mode .device-filter-row {
        max-width: calc(100vw - 20px) !important;
      }
    }


/* id="instant-assist-direct-estimate-landing-css" */

    body.estimate-direct-landing #contact {
      scroll-margin-top: 0 !important;
    }

    body.estimate-direct-landing #estimateBox {
      will-change: opacity, transform, filter;
    }

    body.estimate-direct-landing .estimate-form-panel.open .estimate-form {
      animation-duration: 0.82s !important;
      animation-timing-function: cubic-bezier(0.16, 1, 0.3, 1) !important;
    }

    body.estimate-handoff-loading #productPageTransition.active {
      background: rgba(247, 247, 245, 0.54) !important;
      backdrop-filter: blur(18px) saturate(1.1) !important;
      -webkit-backdrop-filter: blur(18px) saturate(1.1) !important;
    }

    body.estimate-handoff-loading .product-page-transition-card {
      transform: translateY(0) scale(0.92) !important;
      box-shadow: none !important;
    }

    @media (max-width: 760px) {
      body.estimate-direct-landing #estimateBox {
        transform-origin: top center;
      }
    }

/* id="instant-assist-popular-installs-ticker" */

    :root {
      --popular-installs-height: 36px;
      --popular-installs-bottom-gap: 9px;
      --popular-installs-safe-space: calc(
        var(--popular-installs-height) + var(--popular-installs-bottom-gap) + env(safe-area-inset-bottom)
      );
    }

    body {
      padding-bottom: var(--popular-installs-safe-space);
    }

    .popular-installs-strip {
      position: fixed;
      left: 0;
      right: 0;
      bottom: calc(var(--popular-installs-bottom-gap) + env(safe-area-inset-bottom));
      z-index: 70;
      padding: 0 clamp(10px, 2vw, 18px);
      pointer-events: none;
      opacity: 0;
      filter: blur(13px) saturate(0.96);
      transform: translate3d(0, calc(100% + 34px), 0) scale(0.972);
      transform-origin: bottom center;
      transition:
        opacity 1.45s cubic-bezier(0.22, 1, 0.36, 1),
        filter 1.72s cubic-bezier(0.22, 1, 0.36, 1),
        transform 2.28s cubic-bezier(0.16, 1, 0.3, 1);
      will-change: opacity, filter, transform;
    }

    body.packages-ticker-visible .popular-installs-strip {
      opacity: 1;
      filter: blur(0) saturate(1);
      transform: translate3d(0, 0, 0) scale(1);
    }

    .popular-installs-strip .container {
      width: 100%;
      max-width: min(1160px, calc(100vw - 20px));
      padding: 0;
      pointer-events: none;
    }

    body.packages-ticker-visible .popular-installs-strip .container {
      pointer-events: auto;
    }

    .popular-installs-shell {
      min-height: var(--popular-installs-height);
      display: flex;
      align-items: center;
      gap: 10px;
      overflow: hidden;
      background: rgba(8, 9, 11, 0.94);
      color: #ffffff;
      border: 1px solid rgba(255, 255, 255, 0.115);
      border-radius: 999px;
      padding: 0 6px 0 10px;
      box-shadow: 0 7px 20px rgba(0, 0, 0, 0.13);
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
    }

    .popular-installs-label {
      flex: 0 0 auto;
      display: inline-flex;
      align-items: center;
      gap: 7px;
      min-height: 20px;
      padding-right: 9px;
      border-right: 1px solid rgba(255, 255, 255, 0.13);
      color: rgba(255, 255, 255, 0.86);
      font-size: 8.5px;
      font-weight: 900;
      letter-spacing: 0.16em;
      line-height: 1;
      white-space: nowrap;
    }

    .popular-installs-dot {
      width: 5px;
      height: 5px;
      flex: 0 0 5px;
      border-radius: 999px;
      background: #ff3b30;
    }

    .popular-installs-viewport {
      flex: 1 1 auto;
      min-width: 0;
      overflow: hidden;
      outline: none;
    }

    .popular-installs-track {
      width: max-content;
      display: flex;
      align-items: center;
      gap: 10px;
      transform: translate3d(0, 0, 0);
      will-change: transform;
    }

    .popular-install-item {
      position: relative;
      flex: 0 0 auto;
      min-height: 22px;
      display: inline-flex;
      align-items: center;
      gap: 7px;
      padding: 0 9px;
      border: 1px solid rgba(255, 255, 255, 0.11);
      border-radius: 999px;
      background: rgba(255, 255, 255, 0.018);
      color: rgba(255, 255, 255, 0.82);
      font-size: 8.75px;
      font-weight: 850;
      letter-spacing: 0.04em;
      line-height: 1;
      text-transform: uppercase;
      white-space: nowrap;
      transition:
        background-color 0.26s ease,
        border-color 0.26s ease,
        color 0.26s ease;
    }

    .popular-install-item::after {
      content: "";
      position: absolute;
      top: 50%;
      right: -6px;
      width: 1px;
      height: 9px;
      border-radius: 999px;
      background: rgba(255, 255, 255, 0.16);
      transform: translateY(-50%);
      pointer-events: none;
    }

    .popular-install-item:hover,
    .popular-install-item:focus-visible {
      background: rgba(255, 255, 255, 0.045);
      border-color: rgba(255, 255, 255, 0.24);
      color: #ffffff;
    }

    .popular-install-name,
    .popular-install-price {
      display: inline-block;
    }

    .popular-install-price {
      color: #ffffff;
      letter-spacing: 0.035em;
      font-weight: 980;
    }

    @media (max-width: 760px) {
      :root {
        --popular-installs-height: 34px;
        --popular-installs-bottom-gap: 7px;
      }

      .popular-installs-strip {
        padding: 0 7px;
      }

      .popular-installs-strip .container {
        max-width: 100%;
      }

      .popular-installs-shell {
        gap: 6px;
        padding: 0 6px 0 8px;
      }

      .popular-installs-label {
        gap: 5px;
        min-height: 18px;
        padding-right: 7px;
        font-size: 7.25px;
        letter-spacing: 0.105em;
      }

      .popular-installs-dot {
        width: 4.5px;
        height: 4.5px;
        flex-basis: 4.5px;
      }

      .popular-installs-track {
        gap: 8px;
      }

      .popular-install-item {
        min-height: 20px;
        gap: 6px;
        padding: 0 8px;
        font-size: 7.75px;
        letter-spacing: 0.024em;
      }

      .popular-install-item::after {
        right: -5px;
        height: 8px;
      }
    }

    @media (prefers-reduced-motion: reduce) {
      .popular-installs-strip,
      body.packages-ticker-visible .popular-installs-strip {
        transition: none;
      }

      .popular-installs-viewport {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        cursor: grab;
        scrollbar-width: none;
      }

      .popular-installs-viewport::-webkit-scrollbar {
        display: none;
      }

      .popular-installs-viewport.is-dragging {
        cursor: grabbing;
      }

      .popular-installs-track {
        transform: none !important;
        will-change: auto;
      }
    }