/* Core display utilities with !important fallback */
.hidden,
[hidden] {
  display: none !important;
}

@keyframes pulse-fast {

      0%,
      100% {
        opacity: 1;
        transform: scale(1);
      }

      50% {
        opacity: 0.88;
        transform: scale(1.02);
      }
    }

    .alert-flash {
      animation: pulse-fast 0.5s ease-in-out 3;
    }

    .crosshair-spin {
      transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    }

    .group:hover .crosshair-spin {
      transform: rotate(90deg);
    }
  

    #loungeBrandFilter[hidden] {
      display: none !important
    }
  

    #loungeFiltersPanel .lounge-filter-grid {
      display: grid;
      grid-template-columns: repeat(5, minmax(0, 1fr));
      gap: 16px;
      align-items: start
    }

    #loungeFiltersPanel label {
      display: block;
      min-height: 16px;
      margin: 0 0 8px;
      font-size: 11px;
      font-weight: 700;
      line-height: 16px;
      letter-spacing: .07em;
      color: #64748b;
      text-transform: uppercase
    }

    #loungeFiltersPanel select,
    #loungeFiltersPanel input[type="search"],
    #loungeFiltersPanel input[type="text"] {
      box-sizing: border-box;
      width: 100%;
      height: 44px;
      min-height: 44px;
      margin: 0;
      border: 1px solid #cbd5e1;
      border-radius: 12px;
      background-color: #f8fafc;
      color: #0f172a;
      padding: 0 14px;
      font: 500 14px/20px Inter, ui-sans-serif, system-ui, sans-serif;
      outline: none;
      box-shadow: none;
      transition: border-color .15s, box-shadow .15s
    }

    #loungeFiltersPanel select {
      appearance: none;
      padding-right: 14px;
      cursor: pointer
    }

    #loungeFiltersPanel input::placeholder {
      color: #94a3b8;
      font-weight: 400
    }

    #loungeFiltersPanel select:focus,
    #loungeFiltersPanel input:focus {
      border-color: #10b981;
      box-shadow: 0 0 0 3px #10b98122
    }

    #loungeFiltersPanel button:not(#loungeSearchClear) {
      height: 44px;
      border-radius: 12px;
      padding: 0 16px;
      border: 1px solid #cbd5e1;
      font-size: 13px;
      font-weight: 600;
      line-height: 20px;
      background: #f8fafc;
      color: #334155;
      box-shadow: none
    }

    #loungeFiltersPanel input[type="checkbox"] {
      width: 18px;
      height: 18px;
      border-radius: 5px;
      accent-color: #059669
    }

    #loungeSizePills {
      min-width: 190px;
      max-width: 260px;
      flex: 1
    }

    #loungeSizePills select {
      min-width: 190px
    }

    .dark #loungeFiltersPanel select,
    .dark #loungeFiltersPanel input[type="search"],
    .dark #loungeFiltersPanel input[type="text"],
    .dark #loungeFiltersPanel button:not(#loungeSearchClear) {
      background: #0f172a;
      border-color: #334155;
      color: #e2e8f0
    }

    .dark #loungeFiltersPanel .lounge-filter-bottom {
      border-top-color: #334155;
    }

    .dark #loungeFiltersPanel .lounge-filter-bottom label {
      color: #cbd5e1;
    }

    .dark #loungeFiltersPanel input[type=checkbox] {
      accent-color: #3b82f6;
    }

    @media(max-width:1200px) {
      #loungeFiltersPanel .lounge-filter-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr))
      }
    }

    @media(max-width:760px) {
      #loungeFiltersPanel .lounge-filter-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr))
      }
    }

    @media(max-width:480px) {
      #loungeFiltersPanel .lounge-filter-grid {
        grid-template-columns: 1fr
      }
    }
  

    .lp-product-track {
      scrollbar-width: none
    }

    .lp-product-track::-webkit-scrollbar {
      display: none
    }

    .lp-carousel-nav button {
      min-width: 88px;
      height: 44px;
      padding: 0 16px;
      border-radius: 12px;
      font-size: 14px;
      font-weight: 500
    }
  

    .lp-product-verified {
      font-size: 11px;
      line-height: 1.5;
      margin: 12px 0;
      color: #047857
    }
  

    .lp-catalog-stat {
      font-size: 13px;
      margin-top: 18px;
      color: var(--lp-ink)
    }

    .lp-catalog-stat strong {
      font-weight: 700
    }
  

    .lp-markets {
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      gap: 6px;
      margin: 14px 0 6px;
    }

    .lp-markets-row {
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 5px;
      flex-wrap: wrap;
    }

    .lp-markets button {
      height: 28px;
      padding: 0 10px;
      border: 1px solid #d6d7de;
      border-radius: 999px;
      background: transparent;
      color: var(--lp-ink, #202c50);
      font: inherit;
      font-size: 11px;
      font-weight: 600;
      cursor: pointer;
      display: inline-flex;
      align-items: center;
      gap: 3px;
      transition: all .18s;
    }

    .lp-markets button[aria-pressed="true"] {
      background: #0284c7;
      color: white;
      border-color: #0284c7;
    }

    .lp-audiences {
      display: flex;
      justify-content: center;
      gap: 8px;
      flex-wrap: wrap;
      margin: 24px 0 32px
    }

    .lp-audiences button {
      height: 44px;
      min-width: 98px;
      padding: 0 22px;
      border: 1px solid #d6d7de;
      border-radius: 999px;
      background: transparent;
      color: var(--lp-ink, #202c50);
      font: inherit;
      font-size: 14px;
      cursor: pointer;
      transition: background .18s, color .18s
    }

    .lp-audiences button[aria-pressed="true"] {
      background: #202c50;
      color: white;
      border-color: #202c50
    }

    .lp-audiences button:hover {
      border-color: #202c50
    }

    .lp-audiences button:focus-visible {
      outline: 2px solid #7286be;
      outline-offset: 3px
    }

    .lp-carousel-nav button {
      min-width: 48px;
      width: 48px;
      padding: 0;
      font-size: 23px;
      border-radius: 50%
    }
  

    .lp-hero {
      grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
      gap: 48px;
      align-items: center
    }

    .lp-hero-carousel {
      min-width: 0;
      background: #202c50;
      color: #faf9f6;
      border: 0;
      border-radius: 18px;
      padding: 26px;
      transform: none;
      box-shadow: 0 16px 40px #202c5014
    }

    .lp-hero-carousel .lp-carousel-head {
      display: flex;
      justify-content: center;
      margin: 0 0 12px;
      text-align: center
    }

    .lp-hero-carousel .lp-carousel-head h2 {
      width: 100%;
      font-family: inherit;
      font-size: clamp(19px, 1.7vw, 25px);
      font-weight: 400;
      letter-spacing: 1px;
      line-height: 1.25;
      text-align: center
    }

    .lp-hero-carousel .lp-deals-meta {
      font-size: 11px;
      margin: 0;
      gap: 9px;
      color: #e1e5ef;
      justify-content: center
    }

    .lp-hero-carousel .lp-today-dot {
      background: #faf9f6
    }

    .lp-hero-carousel .lp-audiences {
      gap: 6px;
      margin: 18px 0 12px
    }

    .lp-hero-carousel .lp-audiences button {
      min-width: 0;
      flex: 1;
      padding: 0 10px;
      height: 34px;
      font-size: 12px;
      border-color: #faf9f64d;
      color: #faf9f6
    }

    .lp-hero-carousel .lp-audiences button[aria-pressed="true"] {
      background: #faf9f6;
      color: #202c50;
      border-color: #faf9f6
    }

    .lp-hero-carousel .lp-product-track {
      margin: 0
    }

    .lp-hero-carousel .lp-product-slide {
      grid-template-columns: minmax(100px, .8fr) minmax(0, 1fr);
      gap: 20px;
      text-align: left;
      padding: 12px 0 0;
      align-items: center;
      min-height: 245px
    }

    .lp-hero-carousel .lp-product-slide img {
      width: 100%;
      height: 215px;
      max-width: 175px;
      margin: auto;
      background: #faf9f6;
      border-radius: 10px
    }

    .lp-hero-carousel .lp-product-slide h3 {
      font-size: 16px;
      line-height: 1.3;
      margin: 7px 0 10px;
      max-width: 100%;
      letter-spacing: 0
    }

    .lp-hero-carousel .lp-product-brand {
      font-size: 9px;
      line-height: 1.5;
      opacity: .75
    }

    .lp-hero-carousel .lp-product-price {
      font-size: 23px;
      line-height: 1.3
    }

    .lp-hero-carousel .lp-product-original {
      font-size: 11px;
      margin-left: 5px
    }

    .lp-hero-carousel .lp-product-sizes {
      margin: 12px 0 0
    }

    .lp-hero-carousel .lp-size-label {
      color: #d8dfef;
      font-size: 10px;
      margin: 0 0 6px
    }

    .lp-hero-carousel .lp-size-list {
      justify-content: flex-start;
      gap: 4px;
      max-height: 56px;
      overflow-y: auto
    }

    .lp-hero-carousel .lp-size-list li {
      color: #faf9f6;
      border-color: #faf9f64d;
      min-width: 25px;
      font-size: 10px;
      padding: 3px 6px
    }

    .lp-hero-carousel .lp-product-discount {
      background: #faf9f6;
      color: #202c50;
      font-size: 11px;
      padding: 4px 7px;
      margin-top: 10px
    }

    .lp-hero-carousel .lp-product-link {
      color: #faf9f6;
      font-size: 12px;
      margin-top: 12px
    }

    .lp-hero-carousel .lp-carousel-nav {
      display: flex;
      justify-content: center;
      gap: 10px;
      margin: 0;
      padding: 0 0 10px;
      border: 0
    }

    .lp-hero-carousel .lp-carousel-nav button {
      min-width: 36px;
      width: 36px;
      height: 36px;
      font-size: 20px;
      padding: 0;
      color: #faf9f6;
      border: 1px solid #faf9f65c;
      border-radius: 50%;
      background: transparent
    }

    .lp-hero-carousel .lp-carousel-nav button:hover {
      background: #faf9f61a
    }

    .lp-hero-carousel .lp-load {
      color: #faf9f6
    }

    .lp-hero-carousel .lp-currency {
      border-color: #faf9f650
    }

    @media(max-width:900px) {
      .lp-hero {
        gap: 28px
      }

      .lp-hero-carousel {
        padding: 22px
      }

      .lp-hero-carousel .lp-product-slide {
        gap: 14px;
        grid-template-columns: minmax(85px, .75fr) minmax(0, 1fr)
      }

      .lp-hero-carousel .lp-product-slide img {
        height: 180px
      }
    }

    @media(max-width:640px) {
      .lp-hero {
        grid-template-columns: 1fr
      }

      .lp-hero-carousel {
        padding: 22px
      }

      .lp-hero-carousel .lp-carousel-head h2 {
        font-size: 21px
      }

      .lp-hero-carousel .lp-product-slide {
        min-height: 235px;
        grid-template-columns: minmax(100px, .8fr) minmax(0, 1fr)
      }

      .lp-hero-carousel .lp-product-slide img {
        height: 205px
      }

      .lp-hero-carousel .lp-product-slide h3 {
        font-size: 15px
      }
    }
  

    .catalog-overview {
      display: grid;
      grid-template-columns: 210px minmax(0, 1fr);
      align-items: center;
      background: #fff;
      border: 1px solid #e2e5eb;
      border-radius: 20px;
      overflow: hidden;
      box-shadow: 0 8px 28px #202c5005;
      color: #202c50
    }

    .catalog-overview-title {
      align-self: stretch;
      display: flex;
      align-items: center;
      background: #202c50;
      padding: 28px 32px;
      color: #faf9f6
    }

    .catalog-overview-title h1 {
      font-size: 32px;
      font-weight: 600;
      letter-spacing: -1.2px;
      line-height: 1.05;
      margin: 0
    }

    .catalog-overview-title h1 span {
      font-size: 17px;
      letter-spacing: -.2px;
      font-weight: 400;
      opacity: .8
    }

    .catalog-overview-metrics {
      display: grid;
      grid-template-columns: minmax(260px, 1.4fr) 1fr 1fr 1fr;
      align-items: center;
      gap: 0;
      padding: 26px 12px;
      margin: 0
    }

    .catalog-overview-metrics>div {
      padding: 4px 26px;
      border-left: 1px solid #e8eaf0;
      min-width: 0
    }

    .catalog-overview-metrics>div:first-child {
      border: 0
    }

    .catalog-overview-metrics dt {
      font-size: 11px;
      letter-spacing: .9px;
      text-transform: uppercase;
      font-weight: 600;
      color: #7b8397;
      line-height: 1.5;
      white-space: nowrap
    }

    .catalog-overview-metrics dd {
      font-size: clamp(25px, 2.5vw, 38px);
      letter-spacing: -1.3px;
      font-weight: 600;
      font-variant-numeric: tabular-nums;
      line-height: 1.2;
      margin: 8px 0 0
    }

    .catalog-overview-discount dd {
      color: #059669
    }

    .catalog-download-time {
      grid-column: 1/-1;
      display: flex;
      justify-content: flex-end;
      align-items: center;
      flex-wrap: wrap;
      gap: 8px 18px;
      padding: 12px 28px;
      margin: 0;
      border-top: 1px solid #e8eaf0;
      font-size: 12px;
      color: #7b8397
    }

    .catalog-download-time time {
      color: #202c50;
      font-weight: 600;
      font-variant-numeric: tabular-nums
    }

    .dark .catalog-download-time {
      border-color: #28354c
    }

    .dark .catalog-download-time time {
      color: #f1f3f8
    }

    .dark .catalog-overview {
      background: #111b2d;
      border-color: #28354c;
      color: #f1f3f8
    }

    .dark .catalog-overview-metrics>div {
      border-color: #28354c
    }

    .dark .catalog-overview-metrics dt {
      color: #9daac0
    }

    .dark .catalog-overview-discount dd {
      color: #50dbaf
    }

    @media(max-width:1050px) {
      .catalog-overview {
        grid-template-columns: 175px minmax(0, 1fr)
      }

      .catalog-overview-title {
        padding: 24px
      }

      .catalog-overview-metrics>div {
        padding: 4px 17px
      }

      .catalog-overview-metrics dt {
        font-size: 10px;
        letter-spacing: .4px
      }
    }

    @media(max-width:760px) {
      .catalog-overview {
        grid-template-columns: 1fr
      }

      .catalog-overview-title {
        padding: 20px 24px
      }

      .catalog-overview-title h1 br {
        display: none
      }

      .catalog-overview-title h1 {
        font-size: 27px
      }

      .catalog-overview-title h1 span {
        margin-left: 7px;
        font-size: 21px
      }

      .catalog-overview-metrics {
        padding: 22px 8px
      }

      .catalog-overview-metrics>div {
        padding: 0 12px
      }

      .catalog-overview-metrics dd {
        font-size: 27px
      }
    }

    @media(max-width:460px) {
      .catalog-overview-metrics {
        grid-template-columns: 1fr 1fr;
        row-gap: 22px;
        padding: 22px 12px
      }

      .catalog-overview-metrics>div {
        padding: 0 14px
      }

      .catalog-overview-metrics>div:nth-child(3) {
        border-left: 0
      }

      .catalog-overview-metrics dd {
        font-size: 30px
      }
    }

    #loungeFiltersPanel {
      padding: 14px !important;
      border-radius: 14px;
      box-shadow: none
    }

    #loungeFiltersPanel>*+* {
      margin-top: 12px !important
    }

    #loungeFiltersPanel>div:first-child {
      gap: 8px
    }

    #loungeFiltersPanel .lounge-filter-grid {
      gap: 10px;
      grid-template-columns: repeat(5, minmax(0, 1fr))
    }

    #loungeFiltersPanel label {
      font-size: 10px;
      font-weight: 600;
      letter-spacing: .025em;
      line-height: 14px;
      min-height: 0;
      margin-bottom: 5px;
      text-transform: none;
      color: #737f94
    }

    #loungeFiltersPanel select,
    #loungeFiltersPanel input[type=search],
    #loungeFiltersPanel input[type=text] {
      height: 36px;
      min-height: 36px;
      border-radius: 8px;
      padding: 0 10px;
      font-size: 12px;
      line-height: 18px;
      background: #fafbfc
    }

    #loungeFiltersPanel button:not(#loungeSearchClear) {
      height: 36px;
      border-radius: 8px;
      padding: 0 12px;
      font-size: 11px
    }

    #loungeFiltersPanel .lounge-filter-bottom {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      justify-content: flex-start;
      gap: 8px 18px;
      padding-top: 10px;
      border-top: 1px solid #e7ebf1
    }

    #loungeSizePills {
      width: 180px;
      max-width: 100%;
      flex-shrink: 0
    }

    #loungeFiltersPanel .lounge-filter-bottom label {
      display: inline-flex;
      align-items: center;
      gap: 7px;
      margin: 0;
      min-height: 32px;
      font-size: 11px;
      white-space: nowrap;
      font-weight: 500;
      color: #536179
    }

    #loungeFiltersPanel input[type=checkbox] {
      width: 15px;
      height: 15px;
      margin: 0;
      flex-shrink: 0;
      accent-color: #202c50
    }

    #loungeFiltersPanel input#loungeSearchInput {
      padding-left: 11px
    }

    .recommend-switch {
      gap: 6px;
      margin-bottom: 10px
    }

    .recommend-switch button {
      padding: 7px 12px;
      font-size: 11px
    }

    .recommend-profile-options label {
      padding: 5px 9px;
      font-size: 11px
    }

    #flagPricesGrid {
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 6px
    }

    .market-row {
      padding: 5px 8px;
      border: 1px solid #e0e6ef;
      border-radius: 8px;
      background: #f8fafc
    }

    .market-row--best {
      border-color: #bfd9cd;
      background: #f3f8f5
    }

    .market-row-main {
      grid-template-columns: minmax(0, 1fr) auto 36px;
      gap: 6px;
      min-height: 26px
    }

    .market-row-country {
      gap: 5px
    }

    .market-row-country>span {
      font-size: 8px;
      width: 16px
    }

    .market-row-country h5 {
      font-size: 11px
    }

    .market-row-amount strong {
      font-size: 12px;
      line-height: 1.1
    }

    .market-row-amount small {
      font-size: 8px;
      margin-top: 1px
    }

    .market-row-link {
      font-size: 9px;
      padding: 3px 5px;
      border-radius: 5px
    }

    .market-row-details {
      font-size: 8px;
      margin-left: 21px;
      margin-top: 0
    }

    .market-row-details summary {
      padding: 1px 0
    }

    .detail-section-heading {
      margin-bottom: 6px;
      gap: 10px
    }

    #flagPricesHeading {
      cursor: pointer;
      user-select: none;
      padding: 6px 8px;
      margin: -6px -8px 6px -8px;
      border-radius: 8px;
      transition: background-color 0.15s ease;
    }

    #flagPricesHeading:hover {
      background: rgba(148, 163, 184, 0.08);
    }

    .dark #flagPricesHeading:hover {
      background: rgba(255, 255, 255, 0.04);
    }

    #flagPricesHeading:hover #flagPricesChevronWrap {
      background: rgba(16, 185, 129, 0.2) !important;
      color: #10b981 !important;
    }

    .detail-section-heading h4 {
      font-size: 13px
    }

    .detail-section-heading p {
      font-size: 9px;
      margin-top: 1px
    }

    .detail-section-heading>button {
      padding: 4px 8px;
      font-size: 10px;
      border-radius: 6px
    }

    .dark .market-row {
      background: #182336;
      border-color: #344056
    }

    .dark .market-row--best {
      background: #19332c;
      border-color: #345e4f
    }

    @media(max-width:900px) {
      #loungeFiltersPanel .lounge-filter-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr))
      }

      #flagPricesGrid {
        grid-template-columns: repeat(2, minmax(0, 1fr))
      }
    }

    @media(max-width:600px) {
      #loungeFiltersPanel {
        padding: 11px !important
      }

      #loungeFiltersPanel .lounge-filter-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 9px
      }

      #loungeFiltersPanel>div:first-child {
        flex-direction: row;
        flex-wrap: wrap
      }

      #loungeFiltersPanel>div:first-child>.relative {
        flex-basis: 100%
      }

      #loungeFiltersPanel .lounge-filter-bottom {
        gap: 6px 12px
      }

      #loungeSizePills {
        width: 100%
      }

      #loungeFiltersPanel .lounge-filter-bottom label {
        font-size: 10px
      }

      .market-row {
        padding: 4px 7px
      }

      #flagPricesGrid {
        gap: 5px
      }
    }
  

    /* Flex and grid children must be allowed to shrink to the phone viewport. */
    @media (max-width: 767px) {

      html,
      body {
        width: 100%;
        max-width: 100%;
        margin: 0;
      }

      body {
        overflow-x: clip;
      }

      body>header>div,
      body:has(#landingPage:not(.hidden))>header>div {
        width: 100%;
        height: auto;
        min-height: 64px;
        padding: 12px 16px;
        flex-wrap: wrap;
        gap: 12px;
        box-sizing: border-box;
      }

      body>header>div>* {
        min-width: 0;
        max-width: 100%;
      }

      body>header>div>a {
        flex: 1 1 100%;
      }

      body>header>div>div {
        flex: 1 1 100%;
        flex-wrap: wrap;
        gap: 8px;
      }

      body>header button {
        min-height: 44px;
      }

      #themeToggleBtn {
        width: 44px;
        min-width: 44px;
        height: 44px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        padding: 0;
      }

      #appShell,
      #appShell main,
      #viewSniper,
      #viewLounge,
      #viewAdmin {
        min-width: 0;
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
      }

      #appShell {
        padding-inline: 12px;
      }

      #viewSniper>div:first-child {
        padding: 18px 14px;
        border-radius: 20px;
      }

      #viewSniper h1 {
        font-size: 23px;
        line-height: 1.3;
        flex-wrap: wrap;
        gap: 8px;
      }

      #viewSniper h2 {
        flex-wrap: wrap;
      }

      #viewSniper p {
        font-size: 13px;
        overflow-wrap: anywhere;
      }

      #viewSniper .flex>* {
        min-width: 0;
      }

      #viewSniper>div:first-child>.relative {
        flex-direction: column;
        align-items: stretch;
        gap: 18px;
      }

      #viewSniper>div:first-child>.relative>div:last-child {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
      }

      #viewSniper button {
        min-height: 44px;
        justify-content: center;
      }

      #viewSniper>div:first-child>div:last-child {
        flex-direction: column;
        align-items: stretch;
        gap: 16px;
      }

      #viewSniper>div:first-child>div:last-child>div:last-child {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
      }

      #viewSniper>div:first-child>div:last-child>div:last-child>div {
        padding: 10px 8px;
        flex-wrap: wrap;
        font-size: 11px;
      }

      #sniperCardsGrid,
      #loungeGrid {
        grid-template-columns: minmax(0, 1fr);
        gap: 12px;
      }

      #sniperCardsGrid>div {
        min-width: 0;
      }

      #sniperDropBanner {
        align-items: stretch;
        padding: 14px;
        overflow-wrap: anywhere;
      }

      #sniperConsoleLog {
        overflow-x: auto;
      }

      #loungeFiltersPanel {
        padding: 14px;
      }

      #loungeFiltersPanel input,
      #loungeFiltersPanel select {
        font-size: 16px;
        max-width: 100%;
      }

      #loungeSizePills,
      #loungeSizePills select {
        min-width: 0;
        max-width: 100%;
        width: 100%;
      }

      .catalog-overview {
        grid-template-columns: minmax(0, 1fr);
      }

      .catalog-overview-metrics {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        padding: 12px;
      }

      .catalog-overview-metrics>div {
        padding: 10px;
      }

      .product-card-image {
        height: 240px;
      }

      #targetDetailModal {
        padding: 6px;
      }

      #targetDetailModal>div {
        width: 100%;
        padding: 10px 12px;
        max-height: 95dvh;
        overflow: auto;
        gap: 10px !important;
      }

      #targetDetailModal .grid:not(#modalSizesGrid):not(#flagPricesGrid) {
        grid-template-columns: minmax(0, 1fr);
        gap: 8px !important;
      }

      #modalSizesGrid {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        gap: 5px !important;
      }

      #targetDetailModal button:not(.market-row-link),
      #targetDetailModal select {
        min-height: 30px;
      }

      #targetDetailModal .flex {
        flex-wrap: wrap;
      }

      #flagPricesGrid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 5px !important;
      }

      .market-row {
        padding: 4px 6px !important;
      }

      .market-row-main {
        grid-template-columns: minmax(0, 1fr) auto 32px !important;
        gap: 4px !important;
        min-height: 22px !important;
      }

      .market-row-country {
        gap: 3px !important;
      }

      .market-row-country>span {
        font-size: 7px !important;
        width: 13px !important;
      }

      .market-row-country h5 {
        font-size: 10px !important;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
      }

      .market-row-amount strong {
        font-size: 10.5px !important;
      }

      .market-row-amount small {
        font-size: 7.5px !important;
      }

      .market-row-link {
        font-size: 8.5px !important;
        padding: 2px 4px !important;
        min-height: 0 !important;
      }

      .market-row-details {
        font-size: 7.5px !important;
        margin-left: 16px !important;
      }

      table {
        min-width: 650px;
      }

      .overflow-x-auto {
        max-width: 100%;
      }
    }

    @media (min-width:480px) and (max-width:767px) {

      #sniperCardsGrid,
      #loungeGrid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
    }
/* Keep mobile navigation inside its sticky header, including profile controls. */
@media (max-width: 767px) {
  #siteHeader { height: auto; position: sticky; top: 0; z-index: 50; }
  #siteHeader > div,
  body:has(#landingPage:not(.hidden)) > header > div {
    height: auto; min-height: 64px; display: flex; flex-wrap: wrap;
    padding: 8px 12px; gap: 6px;
  }
  #siteHeader > div > a { flex: 1 1 100%; }
  #siteHeader > div > div { flex: 1 1 100%; flex-wrap: wrap; gap: 5px; }
  #userProfileBadge:not(.hidden) { display: contents; }
  #siteHeader button { min-height: 40px; white-space: nowrap; }
  #siteHeader #themeToggleBtn { width: 36px; min-width: 36px; height: 40px; }
  #siteHeader #sniperNavBtn,
  #siteHeader #adminNavBtn,
  #siteHeader #currentCountryBtn,
  #siteHeader .header-bio-button,
  #siteHeader #userProfileBadge button { padding: 6px; font-size: 11px; }
  #sniperNavBtn > span.relative,
  #sniperNavBtn > svg { display: none; }
}
