#player-page {
          color: #FFFFFF !important;
        }

        h1, h2, h3, h4 ,h5, h6, p, bold, em, strong {
          color: #FFFFFF !important;
        }

        .welcome-copy, #productFinder {
          color: #FFFFFF !important;
        }

        .welcome-copy h1 {
          color: #FFFFFF !important;
      }

        :root{
          --bg: #070a0d;
          --bg2:#0b1014;
          --text:#fff;
          --muted: rgba(255,255,255,.72);
          --shadow: 0 20px 50px rgba(0,0,0,.45);
          --radius-xl: 22px;
          --radius-md: 12px;
          --cta: #6b8f8f;
          --cta-hover:#5f7f7f;
          --danger:#ff5c5c;
          --success:#32d296;
          --ease: cubic-bezier(.2,.8,.2,1);
          --t-fast: 220ms;
          --t: 420ms;

          --header-gap: 26px;
          --grid-top-gap: 14px;

          --intro-hero-height: 56vh;
          --intro-min-hero: 380px;
          --intro-max-hero: 640px;

          --intro-pad: 56px;

          --app-max: 1160px;
          --app-pad: 1.25rem;
        }

        *{ box-sizing:border-box; }
        html,body{ height:100%; }
        body{
          margin:0;
          font-family:'Source Sans Pro', sans-serif;
          background: var(--bg);
          color: var(--text);
          overflow-x:hidden;
        }
        a{ text-decoration:none !important; color:inherit !important; }

        .container-custom{
          max-width: var(--app-max);
          margin: 0 auto;
          padding: 0 var(--app-pad);
          width: 100%;
        }

        .breadcrumb-nav{
          position: sticky;
          top: 0;
          z-index: 50;
          padding: 1.1rem 0 .75rem;
          backdrop-filter: blur(14px);
          background: linear-gradient(to bottom, rgba(7,10,13,.78) 0%, rgba(7,10,13,.35) 70%, rgba(7,10,13,0) 100%);
        }
        .breadcrumb-inner{ display:flex; align-items:center; gap: .9rem; }
        .crumb-back{
          width: 40px; height: 40px;
          border-radius: 999px;
          border: 1px solid rgba(255,255,255,.10);
          background: rgba(255,255,255,.06);
          color: #fff;
          cursor:pointer;
          display:inline-flex;
          align-items:center;
          justify-content:center;
          transition: background var(--t-fast) var(--ease), transform var(--t-fast) var(--ease);
          flex: 0 0 auto;
        }
        .crumb-back:hover{ background: rgba(255,255,255,.12); transform: translateY(-1px); }

        .breadcrumb-trail{ display:flex; align-items:center; gap:.5rem; flex-wrap: wrap; width: 100%; }
        .breadcrumb-pill{
          appearance: none;
          border: 1px solid rgba(255,255,255,.08);
          background: rgba(255,255,255,.06);
          color: rgba(255,255,255,.72);
          padding: .40rem .90rem;
          border-radius: 999px;
          font-size: .82rem;
          font-weight: 700;
          cursor: pointer;
          user-select:none;
          white-space: nowrap;
          transition: background var(--t-fast) var(--ease), transform var(--t-fast) var(--ease), border-color var(--t-fast) var(--ease), color var(--t-fast) var(--ease);
        }
        .breadcrumb-pill:hover{
          background: rgba(255,255,255,.10);
          border-color: rgba(255,255,255,.14);
          transform: translateY(-1px);
          color: rgba(255,255,255,.86);
        }
        .breadcrumb-pill.active{
          background: var(--cta);
          border-color: transparent;
          color: #fff;
        }

        #welcomeScreen{
          position: relative;
          min-height: 100vh;
          background: var(--bg);
          overflow-x: hidden;
          overflow-y: visible;
        }

        #welcomeScreen .intro-hero{
          position:absolute;
          top:0; left:0; right:0;
          height: clamp(var(--intro-min-hero), var(--intro-hero-height), var(--intro-max-hero));
          background: url('finder/main_hero_miqk3s.jpg') center/cover no-repeat;
          z-index:0;
        }
        #welcomeScreen .intro-hero::before{
          content:"";
          position:absolute;
          inset:0;
          background:
            radial-gradient(1200px 600px at 35% 10%, rgba(0,0,0,.10) 0%, rgba(0,0,0,.55) 55%, rgba(0,0,0,.70) 100%),
            linear-gradient(to bottom, rgba(0,0,0,.08) 0%, rgba(0,0,0,.42) 55%, rgba(7,10,13,1) 100%);
        }

        #welcomeScreen .welcome-content{
          position: relative;
          z-index: 1;
          width: 100%;
          min-height: 100vh;
          display:flex;
          align-items:center;
          justify-content:center;
          padding: var(--intro-pad) 0;
        }
        #introScreen{ width:100%; }

        .welcome-copy{
          max-width: 920px;
          padding: 1.6rem 0 1.2rem;
        }
        .brand-kicker{
          font-size:.75rem;
          letter-spacing:.22em;
          text-transform:uppercase;
          opacity:.7;
          margin-bottom:.75rem;
        }
        .welcome-copy h1{
          font-size: clamp(2.4rem, 4.0vw, 3.8rem);
          font-weight: 800;
          line-height:1.02;
          margin:0 0 1rem 0;
        }
        .welcome-copy p{
          max-width: 740px;
          font-size: 1rem;
          opacity:.85;
          line-height:1.65;
          margin: 0 0 1.25rem 0;
        }

        .intro-question{
          max-width: 920px;
          margin-top: .35rem;
          padding: .15rem 0 1.0rem;
        }
        .intro-question h2{
          font-size: clamp(1.55rem, 2.1vw, 2.05rem);
          font-weight: 900;
          line-height: 1.08;
          margin: 0 0 .55rem 0;
          letter-spacing: -.01em;
        }
        .intro-question p{
          max-width: 760px;
          margin: 0;
          font-size: 1rem;
          color: rgba(255,255,255,.78);
          line-height: 1.65;
        }

        .recommended-kicker{
          display:flex;
          align-items:center;
          gap:1rem;
          margin: 1.0rem 0 1rem;
          color: rgba(255,255,255,.55);
          letter-spacing: .22em;
          font-size: .7rem;
          text-transform: uppercase;
        }
        .recommended-kicker:before,
        .recommended-kicker:after{
          content:"";
          height: 1px;
          background: rgba(255,255,255,.10);
          flex:1;
        }

        #productFinder{
          min-height:100vh;
          padding: 0 0 4rem;
          background:
            radial-gradient(1200px 700px at 50% -10%, rgba(255,255,255,.06) 0%, rgba(255,255,255,0) 60%),
            linear-gradient(to bottom, var(--bg) 0%, var(--bg2) 100%);
          display:none;
        }

        .content-header{
          max-width: 920px;
          padding-top: .1rem;
          margin-bottom: var(--header-gap);
        }
        .content-header.has-no-desc{
          margin-bottom: calc(var(--header-gap) - 8px);
        }
        #headline{
          font-size: 2.2rem;
          font-weight: 800;
          margin: 0 0 .45rem 0;
          max-width: 920px;
        }
        #description{
          font-size: 1rem;
          color: var(--muted);
          margin: 0;
          max-width: 820px;
          line-height: 1.6;
        }
        .options-grid{ margin-top: var(--grid-top-gap); }

        .option-col{ margin-bottom: 0; }
        .grid-option-btn{
          position:relative;
          width: 100%;
          aspect-ratio: 4 / 3;
          border-radius: var(--radius-xl);
          overflow:hidden;
          cursor:pointer;
          display:flex;
          align-items:flex-end;
          justify-content:flex-start;
          padding: 1rem;
          border: 1px solid rgba(255,255,255,.06);
          background-color: #0a0f13;
          background-size: cover;
          background-position:center;
          background-repeat: no-repeat;
          box-shadow: 0 10px 30px rgba(0,0,0,.25);
          transition: transform var(--t) var(--ease), box-shadow var(--t) var(--ease);
          color: #fff;
          will-change: transform, opacity;
          transform: translateZ(0);
        }
        .grid-option-btn::before{
          content:"";
          position:absolute;
          inset:0;
          background: linear-gradient(to bottom, rgba(0,0,0,.12) 0%, rgba(0,0,0,.45) 55%, rgba(0,0,0,.78) 100%);
          z-index:0;
        }
        .grid-option-btn:hover{ transform: translateY(-4px); box-shadow: var(--shadow); }

        .option-title{
          position:relative;
          z-index:1;
          width:100%;
          display:flex;
          align-items:flex-end;
          justify-content:space-between;
          gap:.75rem;
        }
        .option-title h4{
          margin:0;
          font-size: 1.25rem;
          font-weight: 800;
          line-height:1.15;
          text-shadow: 0 1px 2px rgba(0,0,0,.35);
        }
        .option-arrow{
          width: 42px;
          height: 42px;
          border-radius: 999px;
          background: rgba(255,255,255,.18);
          border: 1px solid rgba(255,255,255,.14);
          display:flex;
          align-items:center;
          justify-content:center;
          flex: 0 0 auto;
          transition: background var(--t-fast) var(--ease), transform var(--t-fast) var(--ease);
        }
        .grid-option-btn:hover .option-arrow{
          background: rgba(255,255,255,.24);
          transform: translateX(1px);
        }
        .option-description{
          margin: .6rem 0 0 0;
          font-size: .92rem;
          color: rgba(255,255,255,.72);
          line-height:1.45;
          padding: 0 .2rem;
        }

        .screen{
          transition: opacity var(--t) var(--ease), transform var(--t) var(--ease), filter var(--t) var(--ease);
          will-change: opacity, transform, filter;
        }
        .screen.fade-out{
          opacity: 0;
          transform: translateY(-10px);
          filter: blur(2px);
          pointer-events:none;
        }
        .screen.fade-in{
          opacity: 0;
          transform: translateY(10px);
          filter: blur(2px);
        }
        .screen.fade-in.is-active{
          opacity: 1;
          transform: translateY(0);
          filter: blur(0);
        }

        .option-col{
          will-change: opacity, transform;
          transition: opacity var(--t) var(--ease), transform var(--t) var(--ease);
        }
        .option-col.enter{ opacity: 0; transform: translateY(14px); }
        .option-col.enter.is-active{ opacity: 1; transform: translateY(0); }
        .option-col.exit{ opacity: 0; transform: translateY(-14px); }

        @media (prefers-reduced-motion: reduce){
          .screen, .option-col, .grid-option-btn, .breadcrumb-pill, .crumb-back{
            transition: none !important;
            animation: none !important;
          }
        }

        .product-card{
          position:relative;
          width:100%;
          border-radius: var(--radius-xl);
          overflow:hidden;
          border: 1px solid rgba(255,255,255,.08);
          background: rgba(20,28,32,.55);
          backdrop-filter: blur(14px);
          box-shadow: 0 10px 30px rgba(0,0,0,.28);
          transition: transform var(--t) var(--ease), box-shadow var(--t) var(--ease), opacity var(--t) var(--ease);
          padding:0;
          display:flex;
          flex-direction:column;
          min-height: 520px;
        }
        .product-card:hover{ transform: translateY(-4px); box-shadow: var(--shadow); }

        .product-card__media{
          position: relative;
          height: 0;
          padding-bottom: 100%;
          background-position: center;
          background-repeat: no-repeat;
          background-size: contain;
          background-color: #ffffff;
        }
        .product-card__media::after{
          content: none !important;
          display: none !important;
        }

        .tag-pill{
          position:absolute;
          top: 12px; left: 12px;
          z-index:2;
          padding: .35rem .70rem;
          border-radius: 999px;
          font-size: .75rem;
          font-weight: 800;
          color: #fff;
          background: rgba(107,143,143,.95);
          border: 1px solid rgba(255,255,255,.14);
          box-shadow: 0 6px 18px rgba(0,0,0,.25);
        }
        .discount-bubble{
          position:absolute;
          top: 12px; right: 12px;
          z-index:2;
          padding: .4rem .75rem;
          border-radius: 999px;
          font-size: .75rem;
          font-weight: 900;
          line-height: 1;
          white-space: nowrap;
          color: #111;
          background: rgba(255,255,255,.92);
          border: 1px solid rgba(255,255,255,.55);
          box-shadow: 0 6px 18px rgba(0,0,0,.25);
        }

        .product-card__content{
          padding: 1.2rem 1.25rem 1.1rem;
          display:flex;
          flex-direction:column;
          gap: .6rem;
          flex: 1 1 auto;
          min-height: 0;
        }

        .product-card__brand{ font-size: .85rem; color: rgba(255,255,255,.65); font-weight: 700; margin-top: .2rem; }
        .product-card__name{ font-size: 1.18rem; font-weight: 900; line-height:1.2; margin: 0; }
        .product-card__description{
          font-size: .95rem;
          color: rgba(255,255,255,.70);
          line-height:1.45;
          margin-top: .15rem;
          min-height: 2.6em;
        }

        .price-row{
          display:flex;
          align-items: baseline;
          gap: .8rem;
          margin-top: auto;
        }

        .price-now{ font-size: 1.45rem; font-weight: 900; color: rgba(255,255,255,.92); }
        .price-old{ font-size: .9rem; color: rgba(255,255,255,.45); text-decoration: line-through; font-weight: 700; }

        .cta-wrap{ padding: 0 1.25rem 1.25rem; }

        .shop-button{
          width:100%;
          display:inline-flex;
          align-items:center;
          justify-content:center;
          gap:.55rem;
          padding: .95rem 1rem;
          border-radius: var(--radius-md);
          background: var(--cta);
          color:#fff !important;
          font-weight: 900;
          letter-spacing:.02em;
          border: 1px solid rgba(255,255,255,.12);
          transition: transform var(--t-fast) var(--ease), background var(--t-fast) var(--ease), opacity var(--t-fast) var(--ease);
          text-decoration:none !important;
          cursor: pointer;
        }
        .shop-button:hover{
          background: var(--cta-hover);
          transform: translateY(-1px);
          color:#fff !important;
        }

        .shop-button--outline{
          background: transparent !important;
          border: 1px solid rgba(255,255,255,.30) !important;
          color: rgba(255,255,255,.92) !important;
        }
        .shop-button--outline:hover{
          background: rgba(255,255,255,.08) !important;
          border-color: rgba(255,255,255,.42) !important;
          transform: translateY(-1px);
          color: #fff !important;
        }

        .spinner{
          position:absolute;
          top: 50%; left: 50%;
          width: 44px; height: 44px;
          border: 4px solid rgba(255,255,255,0.15);
          border-top-color: rgba(255,255,255,0.75);
          border-radius: 50%;
          transform: translate(-50%,-50%);
          animation: spin 1s linear infinite;
          z-index: 5;
        }
        @keyframes spin{ to{ transform: translate(-50%,-50%) rotate(360deg); } }

        .fallback{
          max-width: 980px;
          margin: 1.75rem auto 0;
          padding: 1.5rem 0 0;
          text-align:center;
          border-top: 1px solid rgba(255,255,255,.08);
        }
        .fallback p{ font-size: 1rem; font-weight: 800; margin: 0 0 1rem 0; color: rgba(255,255,255,.78); }

        .d-none{ display:none !important; }
        .options-left{ justify-content: flex-start !important; }

        .row{
          margin-left: 0 !important;
          margin-right: 0 !important;
          display:flex;
          flex-wrap:wrap;
        }
        .row > [class*="col-"]{ padding-left: 0 !important; padding-right: 0 !important; }
        #categoryContainerWelcome, #subcategoryContainer, #productsContainer{ gap: 20px; }

        #categoryContainerWelcome .option-col,
        #subcategoryContainer .option-col,
        #productsContainer .option-col{
          flex: 0 0 calc(33.333% - 20px);
          max-width: calc(33.333% - 20px);
        }

        #productsContainer .option-col{
          display: flex;
        }
        #productsContainer .option-col .product-card{
          height: 100%;
          flex: 1 1 auto;
        }

        @media (max-width: 991px){
          #categoryContainerWelcome .option-col,
          #subcategoryContainer .option-col,
          #productsContainer .option-col{
            flex: 0 0 calc(50% - 20px);
            max-width: calc(50% - 20px);
          }
        }

        @media (max-width: 767px){
          :root{ --intro-hero-height: 48vh; --intro-pad: 40px; }
          #welcomeScreen .intro-hero{ height: clamp(320px, var(--intro-hero-height), 520px); }
          #headline{ font-size: 1.9rem; }
          .product-card{ min-height: 500px; }

          #categoryContainerWelcome .option-col,
          #subcategoryContainer .option-col,
          #productsContainer .option-col{
            flex: 0 0 100% !important;
            max-width: 100% !important;
          }

          #productsContainer .option-col.col-12,
          #productsContainer .option-col.col-md-4{
            flex: 0 0 100% !important;
            max-width: 100% !important;
          }

          #categoryContainerWelcome, #subcategoryContainer, #productsContainer{ gap: 14px; }
        }

        @media (max-height: 760px){
          #welcomeScreen .welcome-content{
            align-items: flex-start;
            padding-top: 48px;
            padding-bottom: 56px;
          }
        }

        .grid-option-btn{
          border: 0;
          box-shadow:
            inset 0 0 0 1px rgba(255,255,255,.06),
            0 10px 30px rgba(0,0,0,.25);
          overflow: hidden;
          border-radius: var(--radius-xl);
          background-clip: padding-box;
          -webkit-mask-image: -webkit-radial-gradient(white, black);
        }

        .grid-option-btn::before{
          border-radius: inherit;
        }

        @media screen and (max-width: 767px) {
          .breadcrumb-nav {
            padding: .65rem 0 .75rem;
            padding-left: 42px;
          }
        }

          h1, h2, h3, h4 ,h5, h6, p, bold, em, strong {
          color: #FFFFFF !important;
        }