@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700;800&family=Space+Grotesk:wght@500;700&display=swap');
    /* Core tokens */
    :root{
      --bg: #f3f4f6;
      --panel: #ffffff;
      --panel-soft: #f4f4f4;
      --surface: #ececec;
      --surface-elevated: rgba(255,255,255,.9);
      --text: #343434;
      --muted: #666666;
      --muted2: #8d8d8d;
      --stroke: rgba(24, 24, 24, .08);
      --stroke-strong: rgba(24, 24, 24, .14);
      --primary: #FF6200;
      --primary-strong: #CC4E00;
      --primary-soft: #FFF1E6;
      --orange: #FF6200;
      --orange-strong: #CC4E00;
      --orange-soft: #FFF1E6;
      --brand-warm: #FF6200;
      --brand: #FF6200;
      --brand-strong: #CC4E00;
      --brand-soft: #FFF1E6;
      --accent: #5115B5;
      --accent-strong: #380C91;
      --accent-soft: #F1EAFB;
      --pink: #FF6200;
      --pink-soft: #FFD9B3;
      --gold: #ffd447;
      --sky: #5115B5;
      --good: #15803d;
      --discount-ink: #ffffff;
      --discount-ink-strong: #ffffff;
      --discount-soft: linear-gradient(135deg, #FF9640 0%, #FF6200 100%);
      --discount-strong: linear-gradient(135deg, #FF9640 0%, #FF6200 100%);
      --discount-border: rgba(255, 98, 0, .22);
      --discount-shadow: 0 10px 24px rgba(255, 98, 0, .22);
      --warn: #52606d;
      --bad: #cf1020;
      --shadow-sm: 0 6px 16px rgba(20, 20, 20, .06);
      --shadow-md: 0 10px 24px rgba(20, 20, 20, .08);
      --shadow-lg: 0 18px 38px rgba(20, 20, 20, .11);
      --shadow-panel: 0 10px 26px rgba(15, 23, 42, .065);
      --radius-sm: 10px;
      --radius-md: 14px;
      --radius-lg: 18px;
      --radius-xl: 22px;
      --space-1: 4px;
      --space-2: 8px;
      --space-3: 16px;
      --space-4: 24px;
      --space-5: 32px;
      --content-max: 1180px;
      --control-height: 48px;
      --control-radius: 14px;
      --panel-radius: 18px;
      --r: var(--panel-radius);
      --font: "Inter", ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial;
      --font-display: "Space Grotesk", "Inter", ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial;

      /* Typography hierarchy — 3 levels, use everywhere instead of ad-hoc weights */
      --fw-headline: 700;
      --fs-headline: 21px;
      --fc-headline: #1A1A1A;

      --fw-title: 600;
      --fs-title: 15px;
      --fc-title: #1A1A1A;

      --fw-meta: 400;
      --fs-meta: 13px;
      --fc-meta: #6B6B6B;
    }
    .text-headline{
      font-weight:var(--fw-headline);
      font-size:var(--fs-headline);
      color:var(--fc-headline);
      line-height:1.15;
    }
    .text-title{
      font-weight:var(--fw-title);
      font-size:var(--fs-title);
      color:var(--fc-title);
      line-height:1.25;
    }
    .text-meta{
      font-weight:var(--fw-meta);
      font-size:var(--fs-meta);
      color:var(--fc-meta);
      line-height:1.4;
    }
    .homeStatsBar{
      display:flex;
      align-items:center;
      justify-content:center;
      width:100%;
      min-height:42px;
      padding:6px 10px;
      border-radius:14px;
      background:linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,247,241,.94));
      border:1px solid rgba(255,98,0,.48);
      box-shadow:
        0 0 0 1px rgba(255,98,0,.16),
        0 0 18px rgba(255,98,0,.28),
        0 10px 22px rgba(255,98,0,.12);
      animation:homeStatsGlow 3.4s ease-in-out infinite;
    }
    .homeStatsBarItem{
      flex:1;
      appearance:none;
      border:0;
      background:transparent;
      min-height:30px;
      display:grid;
      grid-template-columns:auto minmax(0, auto);
      grid-template-rows:auto auto;
      align-items:center;
      justify-content:center;
      gap:1px 7px;
      min-width:0;
      padding:0 4px;
      color:inherit;
      font:inherit;
      text-align:left;
      cursor:pointer;
    }
    .homeStatsIcon{
      grid-row:1 / span 2;
      display:grid;
      place-items:center;
      width:22px;
      height:22px;
      border-radius:8px;
      color:#FF6200;
      background:rgba(255,98,0,.10);
      flex:0 0 auto;
    }
    .homeStatsIcon svg{
      width:15px;
      height:15px;
      fill:none;
      stroke:currentColor;
      stroke-width:2.3;
      stroke-linecap:round;
      stroke-linejoin:round;
    }
    .homeStatsBarItem strong{
      font-weight:var(--fw-headline);
      font-size:15px;
      color:var(--fc-headline);
      letter-spacing:0;
      line-height:1.1;
      max-width:13ch;
      overflow:hidden;
      text-overflow:ellipsis;
      white-space:nowrap;
    }
    .homeStatsBarItem span{
      font-weight:var(--fw-meta);
      font-size:10px;
      color:var(--fc-meta);
      text-align:left;
      line-height:1.05;
      max-width:16ch;
      overflow:hidden;
      text-overflow:ellipsis;
      white-space:nowrap;
    }
    .homeStatsLabel{
      display:block;
      min-width:0;
      max-width:16ch;
      overflow:hidden;
      text-overflow:clip;
      white-space:nowrap;
    }
    .homeStatsLabel > span{
      display:inline-block;
      min-width:max-content;
      max-width:none;
      overflow:visible;
      text-overflow:clip;
      will-change:transform;
    }
    .homeStatsBarItem:hover .homeStatsLabel > span,
    .homeStatsBarItem:focus-visible .homeStatsLabel > span,
    .homeStatsBarItem:active .homeStatsLabel > span{
      animation:homeStatsTextSlide 2.8s ease-in-out infinite;
    }
    @keyframes homeStatsTextSlide{
      0%, 18%{ transform:translateX(0); }
      50%, 68%{ transform:translateX(calc(16ch - 100%)); }
      100%{ transform:translateX(0); }
    }
    .homeStatsBarDivider{
      width:1px;
      height:24px;
      background:rgba(255,98,0,.20);
      margin:0 14px;
      flex-shrink:0;
    }
    @keyframes homeStatsGlow{
      0%, 100%{
        border-color:rgba(255,98,0,.42);
        box-shadow:0 0 0 1px rgba(255,98,0,.12), 0 0 14px rgba(255,98,0,.18), 0 10px 22px rgba(255,98,0,.10);
      }
      50%{
        border-color:rgba(255,98,0,.72);
        box-shadow:0 0 0 1px rgba(255,98,0,.22), 0 0 28px rgba(255,98,0,.34), 0 12px 24px rgba(255,98,0,.14);
      }
    }
    @media (prefers-reduced-motion: reduce){
      .homeStatsBar,
      .homeStatsBarItem:hover .homeStatsLabel > span,
      .homeStatsBarItem:focus-visible .homeStatsLabel > span,
      .homeStatsBarItem:active .homeStatsLabel > span{ animation:none; }
    }
    .head-meta:has(.homeStatsBar){
      width:min(100%, var(--content-max));
      margin:10px auto 0;
      display:flex;
    }
    *{ box-sizing:border-box; }
    img, video, canvas, svg{
      max-width:100%;
    }
    html,body{ height:100%; width:100%; overflow-x:hidden; overscroll-behavior-x:none; }
    body{
      margin:0;
      font-family:var(--font);
      background:var(--bg);
      background-attachment:fixed;
      color:var(--text);
      overflow-x:hidden;
      -webkit-font-smoothing:antialiased;
      text-rendering:optimizeLegibility;
      position:relative;
      touch-action:manipulation;
    }
    body:not(.appReady) .app{
      opacity:0;
      transform:translateY(10px);
      pointer-events:none;
    }
    body.appReady .app{
      opacity:1;
      transform:none;
      transition:opacity .34s ease, transform .34s ease;
    }
    body::before{
      content:"";
      position:fixed;
      inset:-20vh -12vw auto;
      height:58vh;
      pointer-events:none;
      background:
        radial-gradient(42% 54% at 16% 0%, rgba(81,21,181,.08), transparent 62%),
        radial-gradient(38% 52% at 86% 4%, rgba(255,98,0,.08), transparent 66%);
      filter:blur(20px);
      z-index:0;
    }
    body::after{
      content:"";
      position:fixed;
      inset:0;
      pointer-events:none;
      background-image: radial-gradient(circle at 1px 1px, rgba(81,21,181,.06) 1px, transparent 0);
      background-size:24px 24px;
      mask-image:linear-gradient(180deg, rgba(0,0,0,.14) 0%, rgba(0,0,0,.04) 32%, transparent 72%);
      z-index:0;
      opacity:.34;
    }
    .app{
      width:100%;
      max-width:none;
      margin:0 auto;
      min-height:100vh;
      display:flex;
      flex-direction:column;
      overflow-x:hidden;
      position:relative;
      z-index:1;
    }
    .bootSplash{
      position:fixed;
      inset:0;
      z-index:120;
      width:100vw;
      height:100dvh;
      display:flex;
      align-items:center;
      justify-content:center;
      padding:10vw;
      background:#ffffff;
      overflow:hidden;
      opacity:1;
      visibility:visible;
      transition: opacity .42s ease, visibility 0s linear .42s, transform .42s ease;
    }
    .bootSplash.hide{
      opacity:0;
      visibility:hidden;
      pointer-events:none;
      transform:scale(1.02);
    }
    .bootSplashLogo{
      width:min(58vw, 240px);
      height:auto;
      animation: bootSplashPop .5s ease;
    }
    @keyframes bootSplashPop{
      from{ opacity:0; transform:scale(.92); }
      to{ opacity:1; transform:none; }
    }
    /* Top shell */
    .top{
      position:sticky; top:0; z-index:20;
      padding:10px clamp(14px, 3vw, 28px) 10px;
      background:rgba(255,255,255,.86);
      backdrop-filter:blur(18px);
      box-shadow:0 1px 0 rgba(15,23,42,.08);
    }
    .top.homeHeroMode{
      padding:18px clamp(14px, 3vw, 28px) 12px;
      background:transparent;
      backdrop-filter:none;
      box-shadow:none;
    }
    .top.homeHeroMode .brandbar,
    .top.homeHeroMode .head-title,
    .top.homeHeroMode .head-sub{
      display:none;
    }

/* Home feed: simple vertical product list */
main[data-view="home"] .homeDealsOnlySection{
  margin-top:0;
}

main[data-view="home"] .homeDealTools{
  display:grid;
  gap:10px;
  margin:10px 0 0;
}

main[data-view="home"] .homeProductList{
  display:grid;
  gap:16px;
  justify-items:stretch;
}

main[data-view="home"] .homeProductList > .dealCard{
  width:100%;
  max-width:100%;
}

main[data-view="home"] .savingsRankSection{
  margin-top:18px;
}

main[data-view="home"] .savingsRankCard{
  position:relative;
  overflow:hidden;
  padding:24px;
  border-radius:28px;
  background:#0f4228;
  color:#fff;
  border:0;
  box-shadow:0 18px 38px rgba(15,66,40,.22);
}

main[data-view="home"] .savingsRankCard::after{
  content:"";
  position:absolute;
  top:-34px;
  right:-46px;
  width:190px;
  height:190px;
  border-radius:999px;
  background:rgba(255,255,255,.08);
}

main[data-view="home"] .savingsRankLabel,
main[data-view="home"] .savingsRankMetaText,
main[data-view="home"] .savingsRankProgressHeader span,
main[data-view="home"] .savingsRankScaleCompact{
  color:rgba(255,255,255,.62);
}

main[data-view="home"] .savingsRankHeroAmount,
main[data-view="home"] .savingsRankMetaText strong,
main[data-view="home"] .savingsRankProgressHeader strong{
  color:#fff;
}

main[data-view="home"] .savingsRankTierPill{
  position:relative;
  z-index:1;
  color:#fff;
  background:rgba(255,255,255,.16);
  border:1px solid rgba(255,255,255,.18);
  box-shadow:none;
}

main[data-view="home"] .savingsRankLine{
  background:rgba(255,255,255,.18);
}

main[data-view="home"] .savingsRankFill{
  background:#f6c84f;
}

main[data-view="home"] .savingsRankStop{
  background:rgba(255,255,255,.32);
  border-color:transparent;
}

main[data-view="home"] .savingsRankStop.active,
main[data-view="home"] .savingsRankStop.current{
  background:#f6c84f;
  border-color:rgba(255,255,255,.35);
  box-shadow:0 0 0 5px rgba(246,200,79,.16);
}

main[data-view="home"] .savingsRankScaleCompact .current{
  color:#f6c84f;
}

main[data-view="home"] .homeProductList > .dealCard{
  display:grid;
  grid-template-columns:38% minmax(0, 1fr);
  align-items:stretch;
  border-radius:18px;
}

main[data-view="home"] .homeProductList .dealMedia{
  height:auto;
  min-height:168px;
}

main[data-view="home"] .homeProductList .dealBody{
  min-width:0;
  padding:18px 18px 12px;
}

main[data-view="home"] .homeProductList .dealCard:has(.dealTopFlag) .dealBody{
  padding-top:46px;
}

main[data-view="home"] .homeProductList .dealTitle{
  font-size:20px;
  line-height:1.15;
}

main[data-view="home"] .homeProductList .dealNow{
  font-size:34px;
  line-height:1;
  color:#f15a24;
}

main[data-view="home"] .homeProductList .dealDiscountBadge{
  background:linear-gradient(135deg, #7C2FF2 0%, #5115B5 100%);
  color:#fff;
  box-shadow:0 7px 16px rgba(0,0,0,.16);
}

@media (max-width: 430px){
  main[data-view="home"] .homeProductList > .dealCard{
    grid-template-columns:36% minmax(0, 1fr);
  }
  main[data-view="home"] .homeProductList .dealMedia{
    min-height:150px;
  }
  main[data-view="home"] .homeProductList .dealTitle{
    font-size:18px;
  }
  main[data-view="home"] .homeProductList .dealNow{
    font-size:30px;
  }
}
    .top.homeCleanHeader .head-meta{
      display:flex;
    }

/* First-login onboarding */
body:has(#main[data-view="onboarding"]){
  --bg:#f6f1ee;
  --panel:#ffffff;
  --text:#20242c;
  --muted:#66707d;
  background:
    radial-gradient(circle at 10% -8%, rgba(255,122,47,.18), transparent 34%),
    radial-gradient(circle at 92% 2%, rgba(255,98,0,.12), transparent 30%),
    radial-gradient(circle at 20% 100%, rgba(81,21,181,.08), transparent 34%),
    linear-gradient(180deg,#fffaf7 0%, #f2f4f8 100%);
  color:#20242c;
}
#main[data-view="onboarding"]{
  min-height:100dvh;
  display:grid;
  place-items:center;
  padding:clamp(12px, 2.5vw, 28px);
}
.dealOnboarding{
  width:min(100%, 430px);
  margin:0 auto;
}
.onboardingPhone{
  min-height:min(760px, calc(100dvh - 24px));
  display:flex;
  flex-direction:column;
  padding:22px 20px;
  border:1px solid rgba(127,46,35,.12);
  border-radius:32px;
  background:
    radial-gradient(circle at 78% 0%, rgba(255,122,47,.14), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.98), rgba(249,246,244,.99) 58%, rgba(242,245,249,.99));
  box-shadow:0 28px 70px rgba(79,37,28,.16), 0 10px 28px rgba(15,23,42,.08), inset 0 1px 0 rgba(255,255,255,.96);
}
.onboardingDots{
  display:flex;
  gap:8px;
  margin-bottom:26px;
}
.onboardingDots span{
  width:26px;
  height:26px;
  display:grid;
  place-items:center;
  border-radius:999px;
  background:#eef1f5;
  color:#7a8494;
  font-size:12px;
  font-weight:950;
}
.onboardingDots span.active{
  color:#fff;
  background:linear-gradient(135deg,#FF6200,#ff7a2f);
  box-shadow:0 10px 24px rgba(255,98,0,.2);
}
.onboardingPhone h1{
  margin:0;
  color:#1f2229;
  font-size:clamp(27px, 7vw, 34px);
  line-height:1.08;
  letter-spacing:0;
}
.onboardingPhone p{
  margin:14px 0 22px;
  color:#65606a;
  font-size:15px;
  line-height:1.45;
}
.onboardingLoading{
  min-height:420px;
  align-items:flex-start;
  justify-content:center;
}
.onboardingLoader{
  width:48px;
  height:48px;
  margin-bottom:22px;
  border-radius:999px;
  border:4px solid rgba(15,23,42,.09);
  border-top-color:#FF6200;
  animation:onboardingSpin .9s linear infinite;
}
@keyframes onboardingSpin{
  to{ transform:rotate(360deg); }
}
.interestGrid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:11px;
}
.interestCard{
  position:relative;
  min-height:78px;
  overflow:hidden;
  padding:10px;
  border:1px solid rgba(255,255,255,.72);
  border-radius:14px;
  background:#fff;
  color:#1f2430;
  text-align:left;
  isolation:isolate;
  box-shadow:0 10px 22px rgba(33,42,55,.1);
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.interestCard::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:
    linear-gradient(180deg, rgba(255,255,255,.32) 0%, rgba(255,255,255,.04) 34%, rgba(21,25,34,.58) 100%),
    linear-gradient(135deg, rgba(255,122,47,.16), transparent 48%);
}
.interestCard::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  border-radius:inherit;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.72);
  pointer-events:none;
}
.interestCard img{
  position:absolute;
  inset:0;
  z-index:-2;
  width:100%;
  height:100%;
  object-fit:cover;
  opacity:.88;
  filter:saturate(1.08) contrast(1.02);
}
.interestFallback{
  position:absolute;
  inset:0;
  z-index:-2;
  display:grid;
  place-items:center;
  font-size:34px;
  background:
    radial-gradient(circle at 70% 18%, rgba(255,255,255,.8), transparent 28%),
    linear-gradient(135deg, rgba(255,232,218,.98), rgba(235,242,251,.98));
}
.interestLabel{
  position:absolute;
  left:10px;
  right:34px;
  bottom:9px;
  color:#ffffff;
  text-shadow:0 1px 8px rgba(0,0,0,.34);
  font-weight:900;
  font-size:13px;
  line-height:1.1;
}
.interestCheck{
  position:absolute;
  top:8px;
  right:8px;
  width:25px;
  height:25px;
  display:grid;
  place-items:center;
  border:2px solid rgba(255,255,255,.92);
  border-radius:999px;
  color:#fff;
  font-weight:950;
  background:rgba(255,255,255,.22);
  box-shadow:0 4px 12px rgba(0,0,0,.12);
}
.interestCard.active{
  transform:translateY(-1px);
  border-color:rgba(255,98,0,.62);
  box-shadow:0 0 0 3px rgba(255,98,0,.12), 0 18px 34px rgba(140,60,10,.16);
}
.interestCard.active .interestCheck{
  border-color:#fff;
  background:linear-gradient(135deg,#FF6200,#ff7a2f);
}
.onboardingPrimary{
  width:100%;
  min-height:55px;
  margin-top:auto;
  border:0;
  border-radius:20px;
  background:linear-gradient(105deg,#FF6200 0%, #FF8A3D 54%, #ff7a2f 100%);
  color:#fff;
  font-size:16px;
  font-weight:950;
  box-shadow:0 18px 34px rgba(255,98,0,.24), inset 0 1px 0 rgba(255,255,255,.28);
}
.onboardingPrimary:disabled{
  opacity:.45;
  box-shadow:none;
}
.onboardingSecondary{
  min-height:44px;
  margin-top:8px;
  border:0;
  background:transparent;
  color:#343b49;
  font-weight:900;
  font-size:15px;
}
.locationPhone{
  padding-top:26px;
}
.locationRadar{
  position:relative;
  flex:1;
  min-height:310px;
  display:grid;
  place-items:center;
  overflow:hidden;
  margin:4px -8px 24px;
  border:1px solid rgba(255,255,255,.74);
  border-radius:24px;
  background:
    linear-gradient(rgba(255,98,0,.1) 1px, transparent 1px),
    linear-gradient(90deg, rgba(81,21,181,.08) 1px, transparent 1px),
    radial-gradient(circle at 50% 58%, rgba(255,122,47,.2), transparent 15%),
    radial-gradient(circle at 72% 12%, rgba(255,255,255,.86), transparent 30%),
    linear-gradient(180deg,#fff8f4,#edf3f9);
  background-size:34px 34px,34px 34px,100% 100%,100% 100%;
  box-shadow:0 16px 30px rgba(15,23,42,.1), inset 0 1px 0 rgba(255,255,255,.74);
  transform:perspective(520px) rotateX(12deg);
}
.radarGrid{
  position:absolute;
  inset:0;
  background:radial-gradient(circle at 50% 54%, rgba(255,98,0,.2), transparent 8%, transparent 100%);
}
.radarRing{
  position:absolute;
  border:1.5px solid rgba(255,98,0,.24);
  border-radius:999px;
  box-shadow:0 0 18px rgba(255,98,0,.12);
}
.ring1{ width:94px; height:94px; }
.ring2{ width:164px; height:164px; }
.ring3{ width:238px; height:238px; }
.radarPin{
  position:relative;
  z-index:2;
  font-size:66px;
  transform:rotateX(-12deg) translateY(-20px);
  filter:drop-shadow(0 10px 16px rgba(255,105,24,.34));
}
.radarBubble{
  position:absolute;
  z-index:2;
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.76);
  border-radius:16px;
  background:linear-gradient(135deg, rgba(255,255,255,.96), rgba(255,239,232,.94));
  box-shadow:0 12px 26px rgba(15,23,42,.12);
  color:#fff;
  color:#FF6200;
  font-weight:950;
  transform:rotateX(-12deg);
}
.radarBubble.b1{ left:44px; top:42%; }
.radarBubble.b2{ left:32%; bottom:14%; }
.radarBubble.b3{ right:28px; bottom:26%; }
.onboardingDoneVisual{
  position:relative;
  flex:1;
  min-height:260px;
  display:grid;
  place-items:center;
  margin:8px 0 16px;
}
.doneDevice{
  width:165px;
  height:215px;
  display:grid;
  place-items:center;
  border:1px solid rgba(15,23,42,.08);
  border-radius:28px;
  background:linear-gradient(180deg,#ffffff,#fff7f4);
  box-shadow:0 20px 42px rgba(79,37,28,.16);
}
.doneDevice img{
  width:auto;
  height:90px;
  max-width:140px;
  filter:drop-shadow(0 8px 14px rgba(15,23,42,.16));
}
.doneInterest{
  position:absolute;
  width:50px;
  height:50px;
  display:grid;
  place-items:center;
  border-radius:999px;
  background:linear-gradient(135deg,#fff,#fff0e9);
  box-shadow:0 14px 26px rgba(79,37,28,.14);
  font-size:24px;
}
.done0{ top:18px; left:36px; }
.done1{ top:26px; right:36px; }
.done2{ left:18px; top:118px; }
.done3{ right:18px; top:124px; }
.done4{ bottom:18px; left:62px; }
.done5{ bottom:18px; right:62px; }
.selectedInterestPills{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-bottom:14px;
}
.selectedInterestPills span{
  border:1px solid rgba(15,23,42,.08);
  border-radius:999px;
  padding:7px 10px;
  background:linear-gradient(180deg,#ffffff,#fff8f6);
  color:#36323a;
  font-size:12px;
  font-weight:850;
}
@media (min-width: 720px){
  .dealOnboarding{
    width:min(100%, 760px);
  }
  .onboardingPhone{
    min-height:720px;
    padding:30px;
  }
  .interestGrid{
    grid-template-columns:repeat(4, minmax(0,1fr));
  }
  .interestCard{
    min-height:124px;
  }
  .locationRadar{
    min-height:360px;
  }
}
@media (max-width: 380px){
  .onboardingPhone{
    padding:18px 16px;
    border-radius:26px;
  }
  .interestGrid{
    gap:8px;
  }
  .interestCard{
    min-height:74px;
  }
  .onboardingPhone h1{
    font-size:25px;
  }
  .locationRadar{
    min-height:270px;
  }
}
    .brandbar{
      display:flex;
      align-items:center;
      gap:10px;
      margin:0 auto 8px;
      width:min(100%, var(--content-max));
    }
    .logo{
      width:30px; height:30px; border-radius:10px;
      background: linear-gradient(145deg, #ff9db2, #1ca39c 58%, #8ab6ff);
    }
    .brandname{ font-weight:700; font-size:14px; letter-spacing:-.01em; }
    .pill{
      margin-left:auto;
      display:inline-flex;
      align-items:center;
      gap:9px;
      min-height:42px;
      padding:0 15px;
      border:1.5px solid rgba(15,23,42,.12);
      border-radius:999px;
      background:rgba(255,255,255,.96);
      color:#263241;
      box-shadow:0 10px 24px rgba(15,23,42,.06), inset 0 1px 0 rgba(255,255,255,.82);
      max-width: 260px;
      overflow:hidden;
      text-overflow:ellipsis;
      white-space:nowrap;
      cursor:pointer;
      user-select:none;
      font-size:13px;
      font-weight:700;
      line-height:1;
      appearance:none;
      -webkit-appearance:none;
      transition:background .18s ease, transform .18s ease, border-color .18s ease, box-shadow .18s ease;
    }
    .pill:hover{
      background:#ffffff;
      border-color:rgba(255,98,0,.28);
      box-shadow:0 14px 28px rgba(15,23,42,.08), inset 0 1px 0 rgba(255,255,255,.9), 0 0 0 4px rgba(255,98,0,.08);
    }
    .pill:active{
      transform:translateY(1px);
    }
    .pill::before{
      content:"\1F4CD";
      flex:0 0 auto;
      font-size:14px;
      line-height:1;
      opacity:.96;
    }
    .pill::after{
      content:"›";
      flex:0 0 auto;
      font-size:16px;
      line-height:1;
      opacity:.74;
      transform:translateY(-1px);
    }
    .head-title{
      width:min(100%, var(--content-max));
      margin:0 auto;
      display:flex;
      align-items:center;
      gap:10px;
      font-family:var(--font-display);
      font-weight:900;
      font-size:clamp(24px, 3.4vw, 34px);
      line-height:1.02;
      letter-spacing:-.055em;
      color:#111111;
      text-wrap:balance;
    }
    .head-title::before{
      content:none;
    }
    .head-sub{
      width:min(100%, var(--content-max));
      margin:6px auto 0;
      max-width:62ch;
      font-size:13px;
      color:#5f6b78;
      line-height:1.45;
    }
    .head-sub:empty{
      display:none;
    }
    .head-meta{
      width:min(100%, var(--content-max));
      margin:10px auto 0;
      display:flex;
      flex-wrap:wrap;
      gap:10px;
      align-items:stretch;
    }
    .head-meta[hidden]{
      display:none;
    }
    @media (max-width: 760px){
      .promoHero{
        min-height:360px;
        padding:24px 18px 18px;
      }
      .promoGridHero{
        grid-template-columns:minmax(0,1fr);
      }
      .promoTitleRow{
        flex-wrap:wrap;
        gap:12px;
      }
      .promoEyebrow{
        margin-left:62px;
      }
      .promoFeatureGrid{
        gap:10px;
        padding:12px;
      }
    }
    @media (max-width: 640px){
      .top{
        padding:10px 12px 10px;
      }
      .brandbar,
      .head-title,
      .head-sub,
      .head-meta{
        width:100%;
      }
      .pill{
        max-width:100%;
        min-width:0;
        font-size:12px;
      }
      .head-title{
        font-size:clamp(23px, 7vw, 31px);
      }
      .head-title::before{
        content:none;
      }
      .head-sub{
        font-size:12px;
      }
      .head-meta{
        margin-top:8px;
        gap:8px;
      }
      .head-metaCard{
        width:100%;
        max-width:100%;
        padding:9px 12px;
        border-radius:16px;
      }
      .head-metaIcon{
        width:30px;
        height:30px;
        border-radius:10px;
        font-size:14px;
      }
      .head-metaValue{
        white-space:normal;
        overflow-wrap:anywhere;
      }
      .promoHero{
        border-radius:30px;
        min-height:auto;
        padding:20px 14px 16px;
      }
      .promoCopy{
        gap:12px;
        padding:0;
      }
      .promoTitleRow{
        gap:10px;
      }
      .promoFlame{
        font-size:40px;
        margin-top:4px;
      }
      .promoHeadline{
        max-width:none;
        font-size:clamp(28px, 10vw, 44px);
      }
      .promoEyebrow{
        min-height:32px;
        margin-left:50px;
        padding:0 12px;
        font-size:10px;
      }
      .promoMetaRow{
        padding-left:50px;
        font-size:15px;
        gap:8px;
      }
      .promoMetaPin{
        font-size:20px;
      }
      .promoPanel{
        gap:10px;
        padding:16px 12px 12px;
        border-radius:28px;
      }
      .promoCta{
        min-height:56px;
        padding:0 18px;
        font-size:15px;
      }
      .promoArrow{
        font-size:24px;
      }
      .promoMiniGrid{
        grid-template-columns:1fr;
      }
      .promoInstallLink{
        max-width:100%;
        word-break:break-word;
      }
      .promoFeatureGrid{
        gap:10px;
      }
      .promoQuickGrid{ gap:8px; }
      .promoQuickItem{
        min-height:132px;
        padding:12px 8px 10px;
        border-radius:18px;
      }
      .promoQuickArt{
        min-height:50px;
      }
      .promoQuickArt::before{
        width:48px;
        height:48px;
      }
      .promoQuickText strong{
        font-size:16px;
      }
      .promoQuickText small{
        font-size:10px;
      }
      .promoQuickTextPlanner strong,
      .promoQuickTextPlanner small{
        font-size:14px;
      }
      .filterQuickActions{
        grid-template-columns:1fr;
      }
      .filterLocationRow{
        grid-template-columns:1fr;
      }
      .filterRangeWrap{
        padding:14px 8px;
      }
      .filterSectionHead,
      .filterRangeHead{
        align-items:flex-start;
        flex-direction:column;
      }
      .filterSummaryChip,
      .filterChoiceChip{
        min-height:36px;
        padding:0 12px;
        font-size:12px;
      }
      .filterToggle{
        padding:12px 14px;
      }
      .promoFeatureCard{
        padding:12px 8px 14px;
      }
      .promoFeatureArt{
        min-height:62px;
      }
      .promoFeatureArt::before{
        width:56px;
        height:56px;
      }
      .promoFeatureCard strong{
        font-size:14px;
      }
      .promoFeatureCard small{
        font-size:11px;
      }
      .promoInstallCard{
        flex-direction:column;
        align-items:stretch;
      }
      .promoInstallBtn{
        width:100%;
        min-width:0;
      }
      main{
        padding:10px 12px 124px;
        width:100%;
        max-width:100%;
      }
      main::before{
        inset:0 0 104px;
        border-radius:24px 24px 0 0;
      }
      .stack{
        gap:14px;
      }
      .card{
        padding:14px;
        border-radius:20px;
      }
      .promoImageBanner,
      .accountHeroFull,
      .accountPanelFull{
        width:100%;
        margin-left:0;
      }
    }
    /* Content shell */
    .ambientPanel{
      padding:12px;
      background:rgba(255,255,255,.82);
      border:1px solid rgba(15,23,42,.06);
      border-radius:var(--panel-radius);
      box-shadow:0 8px 22px rgba(15,23,42,.045);
      backdrop-filter:blur(14px);
    }
    .homeInlineControls{
      padding:0;
      background:transparent;
      border:none;
      border-radius:0;
      box-shadow:none;
      backdrop-filter:none;
    }
    .homeInlineControls .hr{
      display:none;
    }
    .homeInlineControls .liveToolbar{
      margin-bottom:10px;
    }
    main{
      flex:1;
      width:min(100%, calc(var(--content-max) + clamp(32px, 6vw, 56px)));
      margin:0 auto;
      padding:20px clamp(16px, 3vw, 28px) 136px;
      overflow-x:visible;
      position:relative;
    }
    .stack,
    .card,
    .ambientPanel,
    .brandbar,
    .head-title,
    .head-sub,
    .promoGrid,
    .promoCopy,
    .promoPanel,
    .filterToolbar,
    .liveToolbar,
    .sheetInner,
    .sheetCard{
      min-width:0;
    }
    main::before{
      content:"";
      position:absolute;
      inset:0 0 96px;
      border-radius:34px 34px 0 0;
      background:linear-gradient(180deg, rgba(255,255,255,.22) 0%, rgba(255,255,255,.04) 100%);
      pointer-events:none;
      z-index:-1;
    }
    .card{
      border-radius: var(--r);
      background:
        linear-gradient(180deg, rgba(255,255,255,.98) 0%, rgba(250,251,252,.95) 100%);
      box-shadow:var(--shadow-panel);
      padding:18px;
      border:1px solid rgba(15,23,42,.06);
      backdrop-filter: blur(10px);
    }
    .stack{ display:grid; gap:16px; }
    .homeInstallInline{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:16px;
      background:linear-gradient(180deg, rgba(255,255,255,.96) 0%, rgba(246,247,248,.92) 100%);
    }
    .homeValueHero{
      position:relative;
      overflow:hidden;
      width:100%;
      margin:0;
      min-height:0;
      padding:22px;
      border-radius:26px;
      background:#ffffff;
      color:#202939;
      box-shadow:0 18px 42px rgba(15,23,42,.08);
      border:1px solid rgba(15,23,42,.06);
      display:grid;
      grid-template-columns:minmax(0, 1fr) minmax(240px, .72fr);
      gap:18px 22px;
      align-items:start;
    }
    .homeValueHero::before{
      content:"";
      position:absolute;
      inset:0;
      background:
        radial-gradient(82% 120% at 100% 0%, rgba(81,21,181,.08), transparent 42%),
        linear-gradient(180deg, rgba(255,98,0,.045) 0%, rgba(255,255,255,0) 46%);
      pointer-events:none;
    }
    .homeValueHero > *{
      position:relative;
      z-index:1;
      min-width:0;
    }
    .homeValueHeroEyebrow{
      display:block;
      min-height:0;
      padding:0;
      border-radius:0;
      background:transparent;
      color:#FF6200;
      font-size:11px;
      font-weight:900;
      letter-spacing:.06em;
      text-transform:uppercase;
      border:none;
      box-shadow:none;
      backdrop-filter:none;
    }
    .homeValueHeroTitle{
      margin:12px 0 0;
      max-width:15ch;
      font-family:var(--font-display);
      font-size:clamp(34px, 6vw, 58px);
      line-height:.94;
      letter-spacing:-.04em;
      color:#202939;
      text-wrap:balance;
    }
    .homeValueHeroText{
      margin:12px 0 0;
      max-width:42ch;
      font-size:16px;
      line-height:1.35;
      color:#5f6b78;
      font-weight:750;
    }
    .homeHeroImagePanel{
      grid-column:1 / -1;
      grid-row:auto;
      position:relative;
      align-self:stretch;
      min-height:150px;
      max-height:210px;
      aspect-ratio:3.8 / 1;
      border-radius:22px;
      overflow:hidden;
      background:#f7f8fa;
      border:1px solid rgba(15,23,42,.06);
      box-shadow:0 16px 32px rgba(15,23,42,.08);
    }
    .homeHeroImagePanel img{
      width:100%;
      height:100%;
      display:block;
      object-fit:cover;
    }
    .homeHeroImageCaption{
      position:absolute;
      left:12px;
      right:12px;
      bottom:12px;
      padding:8px 10px;
      border-radius:12px;
      background:rgba(255,255,255,.88);
      color:#202939;
      font-size:11px;
      line-height:1.25;
      font-weight:850;
      box-shadow:0 10px 24px rgba(15,23,42,.14);
      backdrop-filter:blur(12px);
    }
    .homeHotDeal{
      grid-column:1 / -1;
      align-self:stretch;
      display:grid;
      grid-template-columns:104px minmax(0, 1fr);
      align-items:center;
      gap:14px;
      min-height:150px;
      padding:18px;
      border-radius:22px;
      background:#f7f8fa;
      border:1px solid rgba(15,23,42,.06);
      box-shadow:inset 0 1px 0 rgba(255,255,255,.8);
    }
    .homeHotDeal.isClickable{
      cursor:pointer;
      transition:transform .16s ease, border-color .16s ease, box-shadow .16s ease;
    }
    .homeHotDeal.isClickable:hover{
      transform:translateY(-1px);
      border-color:rgba(255,98,0,.16);
      box-shadow:0 14px 28px rgba(15,23,42,.08);
    }
    .homeHotDealMedia{
      width:104px;
      aspect-ratio:1;
      border-radius:18px;
      background:#ffffff;
      border:1px solid rgba(15,23,42,.06);
      display:grid;
      place-items:center;
      overflow:hidden;
      box-shadow:0 10px 24px rgba(15,23,42,.07);
    }
    .homeHotDealMedia img{
      width:100%;
      height:100%;
      object-fit:contain;
      padding:8px;
    }
    .homeHotDealInfo{
      min-width:0;
      display:grid;
      gap:8px;
    }
    .homeHotDealInfo span{
      color:#F15A24;
      font-size:11px;
      font-weight:900;
      letter-spacing:.08em;
      text-transform:uppercase;
    }
    .homeHotDealPriceRow{
      display:flex;
      align-items:center;
      flex-wrap:wrap;
      gap:8px;
    }
    .homeHotDiscountBadge{
      min-height:30px;
      padding:5px 9px;
      border-radius:3px;
      background:#F15A24;
      border-color:#F15A24;
      color:#ffffff;
      font-size:22px;
      font-weight:800;
      box-shadow:none;
    }
    .homeHotPrices{
      display:grid;
      gap:2px;
    }
    .homeHotPrices del{
      color:#8a94a3;
      font-size:12px;
      font-weight:800;
      line-height:1;
      text-decoration-thickness:2px;
    }
    .homeHotPrices small{
      color:#111827;
      font-size:18px;
      font-weight:900;
      line-height:1;
      white-space:nowrap;
    }
    .homeHotDealInfo strong{
      color:#111827;
      font-family:var(--font-display);
      font-size:clamp(18px, 2.4vw, 26px);
      line-height:1;
      letter-spacing:-.04em;
      text-wrap:balance;
      overflow:hidden;
      display:-webkit-box;
      -webkit-line-clamp:2;
      -webkit-box-orient:vertical;
    }
    .homeHotDealInfo em{
      color:#657181;
      font-size:13px;
      font-style:normal;
      font-weight:800;
      line-height:1.25;
    }
    .homeValueHeroActions{
      display:flex;
      flex-wrap:wrap;
      gap:12px;
      margin-top:16px;
    }
    .homeValueHeroActions .btn.primary{
      box-shadow:none;
    }
    .homeValueHeroActions .btn.ghost{
      background:#fff;
      color:#202939;
      border-color:rgba(15,23,42,.10);
      backdrop-filter:none;
    }
    .homeValueHeroActions .btn.ghost:hover{
      background:#f6f6f6;
      border-color:rgba(15,23,42,.16);
    }
    .homePulseGrid{
      display:grid;
      grid-template-columns:repeat(4, minmax(0, 1fr));
      gap:10px;
      margin-top:18px;
      grid-column:1 / -1;
    }
    .homePulseItem{
      min-height:72px;
      padding:12px;
      border-radius:16px;
      background:linear-gradient(180deg, rgba(255,255,255,.94) 0%, rgba(247,248,250,.9) 100%);
      border:1px solid rgba(15,23,42,.08);
      box-shadow:0 10px 24px rgba(15,23,42,.055);
      backdrop-filter:none;
      display:flex;
      flex-direction:column;
      justify-content:space-between;
      gap:8px;
    }
    .homePulseItem span{
      color:#6b7280;
      font-size:11px;
      font-weight:800;
      line-height:1.1;
    }
    .homePulseItem strong{
      color:#16181d;
      font-family:var(--font-display);
      font-size:18px;
      line-height:1;
      letter-spacing:0;
      white-space:nowrap;
      overflow:hidden;
      text-overflow:ellipsis;
    }
    .homePulseItem:first-child strong{
      color:var(--primary);
    }
    .homeInstallCopy strong{
      display:block;
      font-size:16px;
      line-height:1.15;
      letter-spacing:-.02em;
      color:#202939;
    }
    .homeInstallCopy small{
      display:block;
      margin-top:5px;
      font-size:13px;
      line-height:1.4;
      color:#6b7280;
    }
    @media (max-width: 640px){
      .homeValueHero{
        min-height:0;
        width:100%;
        margin:0;
        padding:18px;
        border-radius:22px;
        grid-template-columns:1fr;
      }
      .homeValueHeroTitle{
        max-width:none;
        font-size:clamp(26px, 8vw, 34px);
      }
      .homeValueHeroText{
        font-size:14px;
      }
      .homeHeroImagePanel{
        grid-column:auto;
        grid-row:auto;
        min-height:132px;
        max-height:170px;
        aspect-ratio:2.15 / 1;
      }
      .homeHeroImageCaption{
        font-size:10.5px;
      }
      .homeHotDeal{
        grid-column:auto;
        grid-row:auto;
        min-height:136px;
        padding:14px;
        grid-template-columns:88px minmax(0, 1fr);
        gap:12px;
      }
      .homeHotDealMedia{
        width:88px;
      }
      .homeHotDealInfo strong{
        font-size:20px;
      }
      .homeHotDiscountBadge{
        min-height:28px;
        font-size:18px;
      }
      .homeValueHeroActions{
        display:grid;
        grid-template-columns:minmax(0,1fr);
      }
      .homePulseGrid{
        grid-template-columns:repeat(2, minmax(0, 1fr));
      }
      .homeInstallInline{
        flex-direction:column;
        align-items:stretch;
      }
    }
    .hr{ height:1px; background:rgba(15,23,32,.06); margin:var(--space-3) 0; }
    label{ display:block; font-size:12px; font-weight:600; color:var(--muted); margin-bottom:8px; }
    input, select{
      width:100%;
      min-height:var(--control-height);
      padding:12px 16px;
      border-radius:var(--control-radius);
      border:1px solid transparent;
      background:rgba(255,255,255,.76);
      color:var(--text);
      outline:none;
      font-family: var(--font);
      font-size:14px;
      transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
    }
    input:focus, select:focus{
      background:#fff;
      border-color: rgba(28,163,156,.22);
      box-shadow: 0 0 0 4px rgba(28,163,156,.10);
    }
    input[type="range"]{
      min-height:auto;
      padding:0;
      border:none;
      border-radius:999px;
      background:linear-gradient(90deg, #5115B5 0%, #5115B5 var(--range-progress, 0%), rgba(148,163,184,.28) var(--range-progress, 0%), rgba(148,163,184,.28) 100%);
      box-shadow:none;
      appearance:none;
      -webkit-appearance:none;
      height:8px;
      cursor:pointer;
      transition:background .16s ease;
    }
    input[type="range"]:focus{
      background:linear-gradient(90deg, #380C91 0%, #380C91 var(--range-progress, 0%), rgba(148,163,184,.34) var(--range-progress, 0%), rgba(148,163,184,.34) 100%);
      border:none;
      box-shadow:0 0 0 4px rgba(81,21,181,.12);
    }
    input[type="range"]::-webkit-slider-runnable-track{
      height:8px;
      background:transparent;
      border-radius:999px;
    }
    input[type="range"]::-webkit-slider-thumb{
      -webkit-appearance:none;
      appearance:none;
      width:24px;
      height:24px;
      margin-top:-8px;
      border-radius:50%;
      border:2px solid #ffffff;
      background:linear-gradient(180deg, #8B4FE0 0%, #5115B5 100%);
      box-shadow:0 8px 18px rgba(81,21,181,.24);
    }
    input[type="range"]::-moz-range-track{
      height:8px;
      background:rgba(24,24,24,.10);
      border:none;
      border-radius:999px;
    }
    input[type="range"]::-moz-range-progress{
      height:8px;
      background:#5115B5;
      border-radius:999px;
    }
    input[type="range"]::-moz-range-thumb{
      width:24px;
      height:24px;
      border-radius:50%;
      border:2px solid #ffffff;
      background:linear-gradient(180deg, #8B4FE0 0%, #5115B5 100%);
      box-shadow:0 8px 18px rgba(81,21,181,.24);
    }
    .row{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
    .spacer{ flex:1; }
    .btn{
      display:inline-flex; align-items:center; justify-content:center; gap:8px;
      min-height:var(--control-height);
      padding:12px 16px;
      border-radius:var(--control-radius);
      border:1px solid rgba(24,24,24,.08);
      background: rgba(255,255,255,.92);
      cursor:pointer;
      font-weight:700;
      font-size:14px;
      line-height:1;
      user-select:none;
      white-space:nowrap;
      color:var(--text);
      transition: transform .16s ease, filter .16s ease, box-shadow .16s ease, background .16s ease;
    }
    .btn svg{
      width:16px;
      height:16px;
      flex:0 0 auto;
      display:block;
    }
    .btn.primary{
      color:#fff;
      background: linear-gradient(180deg, var(--primary) 0%, var(--primary-strong) 100%);
      box-shadow: var(--shadow-sm);
      border-color:transparent;
    }
    .btn.ghost{
      background:rgba(255,255,255,.68);
      color:var(--muted);
      border-color:rgba(24,24,24,.10);
      box-shadow:none;
    }
    .btn.danger{
      border:none; color:#fff;
      background: linear-gradient(135deg, var(--bad), #ef4444);
      box-shadow: var(--shadow-sm);
    }
    .btn:hover{ filter:brightness(.98); }
    .btn:active{ transform:scale(.98); }
    .btn[disabled]{ opacity:.54; cursor:not-allowed; box-shadow:none; }
    .hint{ font-weight:var(--fw-meta); font-size:var(--fs-meta); color:var(--fc-meta); line-height:1.4; }
    .tiny{ font-size:11px; color:var(--muted2); }
    .emptyStateCard{
      display:grid;
      gap:10px;
      padding:24px 20px;
      border-radius:22px;
      background:linear-gradient(180deg, rgba(255,255,255,.98) 0%, rgba(246,248,250,.96) 100%);
      border:1px solid rgba(15,23,42,.06);
      box-shadow:0 14px 30px rgba(15,23,42,.05);
      text-align:left;
    }
    .emptyStateBadge{
      display:inline-flex;
      align-items:center;
      justify-self:start;
      min-height:28px;
      padding:5px 10px;
      border-radius:999px;
      background:rgba(255,98,0,.08);
      color:#B34E0F;
      font-size:10px;
      font-weight:800;
      letter-spacing:.08em;
      text-transform:uppercase;
    }
    .emptyStateTitle{
      font-size:24px;
      line-height:1.08;
      letter-spacing:-.035em;
      font-weight:900;
      color:#1b2430;
      max-width:18ch;
    }
    .emptyStateText{
      max-width:52ch;
      font-size:14px;
      line-height:1.5;
      color:#6b7480;
    }
    .emptyStateActions{
      display:flex;
      flex-wrap:wrap;
      gap:10px;
      margin-top:4px;
    }
    .activeFilterBar{
      display:flex;
      flex-wrap:wrap;
      gap:8px;
      margin-top:12px;
    }
    .activeFilterChip,
    .activeFilterReset{
      min-height:30px;
      padding:6px 10px;
      border-radius:999px;
      border:1px solid rgba(15,23,42,.08);
      background:#f5f7f8;
      color:#55616d;
      font-size:11px;
      font-weight:700;
    }
    .activeFilterReset{
      cursor:pointer;
      background:#fff;
    }
    .firstUseCard{
      display:grid;
      gap:12px;
      padding:18px;
      border-radius:22px;
      background:linear-gradient(145deg, rgba(255,255,255,.98) 0%, rgba(247,250,252,.96) 100%);
    }
    .firstUseEyebrow{
      font-size:10px;
      font-weight:800;
      letter-spacing:.08em;
      text-transform:uppercase;
      color:#5115B5;
    }
    .firstUseTitle{
      font-size:22px;
      line-height:1.06;
      letter-spacing:-.03em;
      font-weight:900;
      color:#18212a;
      max-width:20ch;
    }
    .firstUseGrid{
      display:grid;
      grid-template-columns:repeat(3, minmax(0,1fr));
      gap:10px;
    }
    .firstUseStep{
      display:grid;
      gap:5px;
      padding:12px;
      border-radius:16px;
      background:#f6f8fa;
      border:1px solid rgba(15,23,42,.05);
    }
    .firstUseStep b{
      font-size:13px;
      color:#1f2933;
    }
    .firstUseStep span{
      font-size:12px;
      line-height:1.45;
      color:#6b7480;
    }
    .firstUseActions{
      display:flex;
      gap:10px;
      flex-wrap:wrap;
    }
    .filterPriceGrid{
      display:grid;
      grid-template-columns:repeat(2, minmax(0,1fr));
      gap:10px;
    }
    .filterCheck{
      display:flex;
      align-items:center;
      gap:10px;
      margin-top:12px;
      font-size:13px;
      font-weight:600;
      color:#44515d;
    }
    .filterCheck input{
      width:18px;
      height:18px;
      min-height:18px;
      padding:0;
      border-radius:6px;
      box-shadow:none;
    }
    @media (max-width: 640px){
      .firstUseGrid,
      .filterPriceGrid{
        grid-template-columns:1fr;
      }
      .emptyStateCard{
        padding:20px 16px;
      }
      .emptyStateTitle{
        font-size:22px;
      }
    }
    .priceEditorShell.editMode{
      max-width:680px;
      margin:0 auto;
    }
    .priceEditorCard.editMode{
      padding:18px;
      border-radius:22px;
      box-shadow:0 14px 30px rgba(15,23,42,.08);
    }
    .priceEditorTop.editMode{
      gap:8px;
    }
    .priceEditorCloseBtn{
      min-width:40px;
      width:40px;
      padding:0;
      font-size:18px;
      line-height:1;
      border-radius:999px;
    }
    .priceEditorProductRow.editMode{
      gap:12px;
      align-items:center !important;
    }
    .priceEditorThumb.editMode{
      width:116px;
      height:116px;
      border-radius:18px;
      flex:0 0 116px;
      background:linear-gradient(180deg, #f8f8f8 0%, #f1f3f5 100%);
      overflow:hidden;
    }
    .priceEditorThumb.editMode img{
      width:100%;
      height:100%;
      object-fit:contain;
      padding:10px;
    }
    .priceEditorCard.editMode .ititle{
      font-size:18px;
      line-height:1.15;
    }
    .priceEditorCard.editMode .tag{
      min-height:28px;
      padding:5px 10px;
    }
    .priceEditorSubcard.editMode{
      padding:10px !important;
      border-radius:18px;
    }
    .priceEditorFields.editMode{
      grid-template-columns:1fr !important;
      gap:8px !important;
    }
    .priceEditorCard.editMode label{
      margin-bottom:6px;
      font-size:11px;
    }
    .priceEditorCard.editMode input,
    .priceEditorCard.editMode select{
      min-height:44px;
      padding:10px 14px;
      border-radius:14px;
      font-size:13px;
    }
    .priceEditorActions.editMode{
      margin-top:10px !important;
    }
    .priceEditorActions.editMode .btn{
      min-height:44px;
    }
    .progressiveHint{
      text-align:center;
      padding:8px 0 2px;
    }
    .chips{ display:flex; gap:8px; overflow:auto; padding-bottom:2px; }
    .chip{
      flex:0 0 auto;
      padding:9px 12px;
      border-radius:999px;
      background: #fff;
      box-shadow: var(--shadow-sm);
      font-weight:700;
      font-size:12px;
      cursor:pointer;
      user-select:none;
    }
    .chip.active{
      color:#fff;
      background: var(--brand);
    }
    .categoryBar{
      display:flex;
      gap:6px;
      overflow-x:auto;
      overflow-y:hidden;
      padding:2px 0 4px;
      overscroll-behavior-x:contain;
      touch-action:auto;
      -webkit-overflow-scrolling:touch;
      scroll-snap-type:x proximity;
      scrollbar-width:none;
      -ms-overflow-style:none;
    }
    .categoryBar::-webkit-scrollbar{ display:none; }
    .reportsHero{
      position:relative;
      overflow:hidden;
      display:grid;
      grid-template-columns:minmax(0, 1.15fr) minmax(280px, .95fr);
      gap:14px;
      padding:18px;
      border-radius:28px;
      background:
        linear-gradient(180deg,
          rgba(255,98,0,.96) 0%,
          rgba(255,98,0,.96) 34%,
          rgba(236,58,67,.84) 44%,
          rgba(245,166,171,.34) 52%,
          rgba(243,243,243,.98) 66%,
          rgba(243,243,243,.98) 100%);
      box-shadow: 0 16px 34px rgba(15, 23, 32, .10);
      color:#2d2d2d;
      border:1px solid rgba(15,23,32,.06);
    }
    .reportsHero::after{
      content:"";
      position:absolute;
      inset:auto -30px -50px auto;
      width:160px;
      height:160px;
      border-radius:50%;
      background:rgba(255,255,255,.55);
      filter:blur(2px);
    }
    .reportsHeroCopy,
    .reportsHeroVisual{
      position:relative;
      z-index:1;
    }
    .reportsHeroEyebrow{
      display:inline-flex;
      align-items:center;
      gap:8px;
      padding:7px 11px;
      border-radius:999px;
      border:1px solid rgba(255,255,255,.18);
      background:rgba(81,21,181,.94);
      font-size:11px;
      font-weight:800;
      letter-spacing:.08em;
      text-transform:uppercase;
      color:#ffffff;
    }
    .reportsHeroTitle{
      margin:12px 0 8px;
      font-size:clamp(26px, 4vw, 38px);
      line-height:1.04;
      letter-spacing:-.03em;
      font-weight:900;
      max-width:12ch;
      color:#ffffff;
    }
    .reportsHeroText{
      max-width:40ch;
      font-size:13px;
      line-height:1.45;
      color:#5f6b78;
    }
    .reportsHeroMeta{
      display:flex;
      flex-wrap:wrap;
      gap:10px;
      margin-top:16px;
    }
    .reportsHeroStat{
      min-width:116px;
      padding:12px 14px;
      border-radius:18px;
      background:rgba(255,255,255,.1);
      border:1px solid rgba(255,255,255,.14);
      backdrop-filter:blur(10px);
    }
    .reportsHeroStat strong{
      display:block;
      font-size:20px;
      line-height:1.1;
      color:#ffffff;
    }
    .reportsHeroStat span{
      display:block;
      margin-top:3px;
      font-size:12px;
      color:rgba(239,252,249,.76);
    }
    .reportsHeroVisual{
      display:grid;
      grid-template-columns:repeat(2, minmax(0,1fr));
      gap:10px;
      align-content:stretch;
      min-height:212px;
    }
    .reportsHeroTile{
      position:relative;
      min-height:98px;
      padding:12px;
      border-radius:18px;
      overflow:hidden;
      display:flex;
      align-items:flex-end;
      background-color:#d9d9d9;
      background-position:center;
      background-repeat:no-repeat;
      background-size:cover;
      border:5px solid rgba(255,255,255,.96);
      box-shadow: 0 10px 20px rgba(15,23,32,.08);
      isolation:isolate;
    }
    .reportsHeroTile::before{
      content:"";
      position:absolute;
      top:10px;
      left:10px;
      padding:5px 9px;
      border-radius:999px;
      font-size:10px;
      font-weight:800;
      letter-spacing:.08em;
      text-transform:uppercase;
      color:#ffffff;
      background:#5115B5;
      border:1px solid rgba(255,255,255,.18);
    }
    .reportsHeroTile::after{
      content:"";
      position:absolute;
      inset:0;
      background:
        linear-gradient(180deg, rgba(255,255,255,.06) 0%, rgba(15, 23, 32, .34) 100%),
        var(--tile-grad, linear-gradient(135deg, rgba(255,255,255,.16), rgba(255,255,255,.04)));
      z-index:0;
    }
    .reportsHeroTile > div{
      position:relative;
      z-index:1;
    }
    .reportsHeroTile span{
      display:block;
      font-size:14px;
      font-weight:900;
      letter-spacing:-.02em;
      color:#ffffff;
    }
    .reportsHeroTile strong{
      display:block;
      margin-top:6px;
      font-size:24px;
      line-height:1;
      font-weight:900;
      letter-spacing:-.04em;
      color:#ffffff;
      text-shadow:0 8px 18px rgba(15,23,32,.28);
    }
    .reportsHeroTile small{
      display:block;
      margin-top:6px;
      font-size:11px;
      color:rgba(255,255,255,.86);
    }
    @media (max-width: 860px){
      .reportsHero{
        grid-template-columns:1fr;
        padding:18px;
      }
      .reportsHeroTitle{ max-width:unset; }
      .reportsHeroVisual{ min-height:unset; }
    }
    @media (max-width: 560px){
      .reportsHeroVisual{ gap:10px; }
      .reportsHeroTile{ min-height:104px; padding:12px; border-radius:18px; }
      .reportsHeroMeta{ gap:8px; }
      .reportsHeroStat{ flex:1 1 120px; }
    }
    .infoStrip{
      display:grid;
      grid-template-columns:repeat(3, minmax(0,1fr));
      gap:10px;
    }
    .miniStat{
      padding:14px;
      border-radius:18px;
      background:#fff;
      box-shadow:var(--shadow-sm);
      border:1px solid rgba(15,23,32,.05);
    }
    .miniStat strong{
      display:block;
      font-size:24px;
      line-height:1;
      letter-spacing:-.04em;
      font-weight:800;
      color:var(--text);
    }
    .miniStat span{
      display:block;
      margin-top:6px;
      font-size:12px;
      color:var(--muted);
      line-height:1.35;
    }
    .prospectGrid{
      display:grid;
      gap:14px;
      grid-template-columns:minmax(0, 1.2fr) minmax(280px, .8fr);
    }
    .plannerCard,
    .storePanel{
      background:transparent;
      border-radius:22px;
      box-shadow:none;
      padding:2px 0;
      border:none;
    }
    .plannerInputRow{
      display:flex;
      gap:10px;
      margin-top:12px;
    }
    .plannerIntro{
      display:grid;
      gap:6px;
      margin-bottom:6px;
    }
    .plannerIntro .sectionTitle{
      margin:0;
    }
    .plannerIntro .hint{
      margin-top:0;
      max-width:42ch;
    }
    .plannerInputRow input{
      flex:1;
      min-width:0;
    }
    .plannerSummary{
      display:grid;
      grid-template-columns:repeat(2, minmax(0, 1fr));
      gap:10px;
      margin-top:14px;
    }
    .plannerSummaryCard{
      display:grid;
      gap:4px;
      padding:14px 16px;
      border-radius:18px;
      background:rgba(255,255,255,.9);
      box-shadow:inset 0 0 0 1px rgba(24,24,24,.05);
    }
    .plannerSummaryCard strong{
      font-size:22px;
      line-height:1;
      letter-spacing:-.03em;
      color:#13212b;
    }
    .plannerSummaryCard span{
      font-size:12px;
      color:var(--muted);
      line-height:1.4;
    }
    .plannerSummaryCard.highlight{
      background:linear-gradient(135deg, rgba(21,128,61,.12), rgba(255,255,255,.96));
    }
    .plannerList{
      display:grid;
      gap:8px;
      margin-top:14px;
    }
    .plannerItem{
      display:flex;
      align-items:flex-start;
      gap:10px;
      padding:10px 0;
      border-radius:0;
      background:transparent;
      border-bottom:1px solid rgba(24,24,24,.08);
    }
    .plannerItemMain{
      min-width:0;
      flex:1;
    }
    .plannerItem b{
      display:block;
      font-weight:var(--fw-title);
      font-size:var(--fs-title);
      color:var(--fc-title);
      line-height:1.25;
    }
    .plannerItem span{
      display:block;
      margin-top:3px;
      font-weight:var(--fw-meta);
      font-size:var(--fs-meta);
      color:var(--fc-meta);
    }
    .plannerCheck{
      width:18px;
      height:18px;
      border-radius:999px;
      border:2px solid rgba(15,118,110,.28);
      background:#fff;
      flex:0 0 auto;
      cursor:pointer;
    }
    .plannerItem.done .plannerCheck{
      background:var(--brand);
      border-color:var(--brand);
      box-shadow: inset 0 0 0 4px #ffffff;
    }
    .plannerItem.done .plannerItemTitle,
    .plannerItem.done .plannerItemHint{
      opacity:.56;
      text-decoration:line-through;
    }
    .plannerMeta{
      margin-left:auto;
      min-width:78px;
      text-align:right;
    }
    .plannerMatchList{
      display:grid;
      gap:6px;
      margin-top:8px;
    }
    .plannerMatchCard{
      display:flex;
      align-items:center;
      gap:10px;
      padding:6px 0;
      border-radius:0;
      background:transparent;
      box-shadow:none;
    }
    .plannerMatchThumb{
      width:42px;
      height:42px;
      border-radius:12px;
      overflow:hidden;
      flex:0 0 auto;
      display:grid;
      place-items:center;
      background:#ffffff;
      box-shadow:inset 0 0 0 1px rgba(24,24,24,.06);
      color:var(--accent);
      font-size:16px;
      font-weight:800;
    }
    .plannerMatchThumb img{
      width:100%;
      height:100%;
      object-fit:cover;
      display:block;
    }
    .plannerMatchCopy{
      min-width:0;
      display:grid;
      gap:2px;
    }
    .plannerMatchCopy b{
      font-weight:var(--fw-title);
      font-size:13px;
      color:var(--fc-title);
      line-height:1.2;
      white-space:nowrap;
      overflow:hidden;
      text-overflow:ellipsis;
    }
    .plannerMatchCopy span{
      margin-top:0;
      font-weight:var(--fw-meta);
      font-size:11px;
      line-height:1.3;
      color:var(--fc-meta);
      white-space:nowrap;
      overflow:hidden;
      text-overflow:ellipsis;
    }
    .plannerPurchaseNote{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:10px;
      margin-top:8px;
      padding:10px 12px;
      border-radius:14px;
      background:rgba(21,128,61,.08);
    }
    .plannerPurchaseNote span{
      margin-top:0;
      font-size:11px;
      color:#166534;
    }
    .plannerPurchaseNote strong{
      font-size:12px;
      color:#166534;
      white-space:nowrap;
    }
    .plannerConfirmBtn{
      margin-left:auto;
      flex:0 0 auto;
      min-width:88px;
      text-align:center;
    }
    .plannerConfirmBtn.active{
      background:#166534;
      color:#fff;
      border-color:#166534;
    }
    .plannerMetaSaved{
      margin-bottom:8px;
      font-size:12px;
      font-weight:800;
      color:#166534;
    }
    .plannerFloatingAdd{
      position:fixed;
      right:18px;
      bottom:calc(112px + env(safe-area-inset-bottom, 0px));
      width:54px;
      min-width:54px;
      height:54px;
      padding:0;
      border-radius:999px;
      font-size:28px;
      line-height:1;
      box-shadow:var(--shadow-lg);
      z-index:48;
    }
    .plannerComposerSheet{
      bottom:calc(84px + env(safe-area-inset-bottom, 0px));
    }
    .plannerComposerCard{
      border-radius:24px;
    }
    .plannerOverlayResults{
      display:grid;
      gap:8px;
      margin-top:14px;
    }
    .plannerOverlayResult{
      width:100%;
      display:flex;
      align-items:center;
      gap:10px;
      padding:10px;
      border:none;
      border-radius:16px;
      background:rgba(255,255,255,.88);
      box-shadow:inset 0 0 0 1px rgba(24,24,24,.05);
      text-align:left;
      cursor:pointer;
      font:inherit;
    }
    .plannerOverlayAction{
      margin-left:auto;
      flex:0 0 auto;
      font-size:11px;
      font-weight:800;
      color:var(--accent);
      text-transform:uppercase;
      letter-spacing:.04em;
    }
    .plannerEmpty{
      margin-top:14px;
      padding:14px;
      border-radius:14px;
      background:rgba(24,24,24,.04);
      color:var(--muted);
      font-size:13px;
      line-height:1.45;
    }
    .storeSectionHeader{
      display:grid;
      grid-template-columns:auto minmax(0,1fr);
      gap:10px;
      align-items:start;
    }
    .storeSectionDot{
      width:34px;
      height:34px;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      color:#FF6200;
      margin-top:0;
    }
    .storeSectionDot img{
      width:30px;
      height:30px;
      display:block;
      object-fit:contain;
    }
    .storeSectionCopy{
      min-width:0;
    }
    .storeSectionTitle{
      font-size:var(--fs-headline);
      line-height:1.15;
      font-weight:var(--fw-headline);
      color:var(--fc-headline);
      letter-spacing:-.03em;
      padding-top:6px;
    }
    .storeSectionSub{
      margin-top:3px;
      font-size:12px;
      line-height:1.35;
      color:#727b88;
    }
    .storeHotBar{
      display:inline-flex;
      align-items:center;
      gap:8px;
      min-height:34px;
      margin-top:12px;
      padding:0 12px;
      border-radius:999px;
      background:rgba(255,241,238,.52);
      color:#FF6200;
      font-size:12px;
      font-weight:800;
      box-shadow:inset 0 0 0 1px rgba(255,98,0,.08);
    }
    .storeHotBar--attached{
      display:flex;
      width:fit-content;
      margin:0 0 8px;
      border-radius:12px;
    }
    .storeHotIcon{
      width:20px;
      height:20px;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      color:#ff6a3d;
      flex:0 0 auto;
    }
    .storeHotIcon svg{
      width:18px;
      height:18px;
      stroke:currentColor;
      fill:none;
      stroke-width:2;
      stroke-linecap:round;
      stroke-linejoin:round;
    }
    .storeGrid{
      display:grid;
      gap:10px;
      margin-top:12px;
    }
    .storeTile{
      display:block;
      width:100%;
      padding:11px 11px 9px;
      border-radius:20px;
      border:none;
      text-align:left;
      font:inherit;
      background:#ffffff;
      box-shadow:
        0 10px 26px rgba(15,23,42,.08),
        0 2px 8px rgba(15,23,42,.04);
      cursor:pointer;
      transition: transform .16s ease, background .16s ease, box-shadow .16s ease;
    }
    .storeTile:hover{
      transform:translateY(-1px);
      box-shadow:
        0 16px 32px rgba(15,23,42,.10),
        0 3px 10px rgba(15,23,42,.05);
    }
    .storeTile:active{
      transform:translateY(0) scale(.988);
      box-shadow:0 8px 18px rgba(15,23,42,.10);
    }
    .storeTile:focus-visible{
      outline:none;
      box-shadow:0 0 0 4px rgba(148,163,184,.16), 0 16px 28px rgba(15,23,42,.10);
    }
    .storeTile.active{
      background:#ffffff;
      box-shadow:0 16px 30px rgba(15,23,42,.10);
    }
    .storeTileMain{
      display:grid;
      grid-template-columns:minmax(0,1fr) auto;
      gap:10px;
      align-items:start;
    }
    .storeIdentity{
      min-width:0;
      display:grid;
      grid-template-columns:auto minmax(0,1fr);
      gap:8px;
      align-items:start;
    }
    .storeMark{
      width:48px;
      height:48px;
      border-radius:14px;
      display:grid;
      place-items:center;
      background:#0b77c5;
      color:#ffffff;
      font-size:15px;
      font-weight:900;
      flex:0 0 auto;
      box-shadow:none;
    }
    .storeMark.tone-0{
      background:#0b77c5;
      color:#ffffff;
    }
    .storeMark.tone-1{
      background:#d10f3d;
      color:#ffffff;
    }
    .storeMark.tone-2{
      background:#0b8c52;
      color:#ffffff;
    }
    .storeMark.tone-3{
      background:#cc7400;
      color:#ffffff;
    }
    .storeMark.tone-4{
      background:#6b21e6;
      color:#ffffff;
    }
    .storeCopy{
      min-width:0;
    }
    .storeName{
      display:block;
      font-size:var(--fs-title);
      line-height:1.25;
      font-weight:var(--fw-title);
      color:var(--fc-title);
      letter-spacing:-.02em;
    }
    .storeTileMeta{
      display:flex;
      flex-wrap:wrap;
      gap:5px;
      margin-top:4px;
      align-items:center;
    }
    .storeMetaItem{
      display:inline-flex;
      align-items:center;
      gap:6px;
      min-height:22px;
      color:var(--fc-meta);
      font-size:11px;
      font-weight:var(--fw-meta);
      letter-spacing:-.01em;
    }
    .storeMetaDivider{
      color:#9ca3af;
      font-size:12px;
      line-height:1;
      font-weight:700;
    }
    .storeMetaIcon{
      width:16px;
      height:16px;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      color:#9ca3af;
      flex:0 0 auto;
    }
    .storeMetaItem:first-child .storeMetaIcon{
      color:#ef4444;
    }
    .storeMetaIcon svg,
    .storeChevron svg{
      width:16px;
      height:16px;
      stroke:currentColor;
      fill:none;
      stroke-width:2;
      stroke-linecap:round;
      stroke-linejoin:round;
    }
    .storeCategoryRow{
      display:flex;
      flex-wrap:wrap;
      gap:5px;
      margin-top:7px;
    }
    .storeCategoryChip{
      display:inline-flex;
      align-items:center;
      min-height:22px;
      padding:0 8px;
      border-radius:10px;
      background:#f3f5f8;
      color:#646d79;
      font-size:10px;
      font-weight:700;
      white-space:nowrap;
      letter-spacing:-.01em;
      box-shadow:none;
    }
    .storeCategoryChip.muted{
      background:#f8fafc;
      color:#64748b;
    }
    .storePriceCol{
      min-width:82px;
      display:grid;
      justify-items:end;
      align-content:start;
      gap:0;
      text-align:right;
      padding-top:1px;
    }
    .storePriceValue{
      font-size:17px;
      line-height:1;
      font-weight:var(--fw-title);
      color:#FF6200;
      letter-spacing:-.035em;
      white-space:nowrap;
    }
    .storeChevron{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      color:#9ca3af;
    }
    .storeTileFooter{
      display:grid;
      grid-template-columns:minmax(0,1fr) auto;
      align-items:center;
      gap:10px;
      margin-top:8px;
      padding-top:8px;
      border-top:1px solid rgba(20,20,24,.08);
    }
    .storeSignal{
      display:inline-flex;
      align-items:center;
      gap:6px;
      min-width:0;
      color:var(--fc-meta);
      font-size:10px;
      font-weight:var(--fw-meta);
      line-height:1.35;
    }
    .storeSignalIcon{
      width:18px;
      height:18px;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      flex:0 0 auto;
    }
    .storeSignalIcon svg,
    .storeFooterChevron svg{
      width:18px;
      height:18px;
      stroke:currentColor;
      fill:none;
      stroke-width:2;
      stroke-linecap:round;
      stroke-linejoin:round;
    }
    .storeSignal--fresh{
      color:#8348E6;
    }
    .storeSignal--confirm{
      color:#6b7280;
    }
    .storeFooterChevron{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      color:#c8ced6;
    }
    @media (max-width: 900px){
      .prospectGrid{
        grid-template-columns:1fr;
      }
    }
    @media (max-width: 640px){
      .storeSectionTitle{
        font-size:18px;
      }
      .storeHotBar{
        min-height:32px;
        padding:0 10px;
        font-size:12px;
      }
      .infoStrip{
        grid-template-columns:1fr;
      }
      .plannerInputRow{
        flex-direction:column;
      }
      .plannerFloatingAdd{
        right:14px;
        bottom:calc(104px + env(safe-area-inset-bottom, 0px));
        width:50px;
        min-width:50px;
        height:50px;
      }
      .plannerSummary{
        grid-template-columns:1fr;
      }
      .plannerMeta{
        min-width:auto;
      }
      .plannerOverlayResult{
        align-items:flex-start;
      }
      .plannerOverlayAction{
        padding-top:2px;
      }
      .feedbackGrid{
        grid-template-columns:1fr;
      }
      .feedbackHero{
        padding:20px;
        border-radius:24px;
      }
      .storeTile{
        padding:10px 10px 8px;
        border-radius:18px;
      }
      .storeTileMain{
        gap:10px;
      }
      .storeIdentity{
        gap:8px;
      }
      .storeMark{
        width:42px;
        height:42px;
        border-radius:12px;
        font-size:14px;
      }
      .storeName{
        font-size:13px;
      }
      .storePriceCol{
        min-width:70px;
      }
      .storePriceValue{
        font-size:16px;
      }
      .storeCategoryChip{
        min-height:20px;
        padding:0 7px;
        font-size:10px;
      }
      .storeTileFooter{
        margin-top:7px;
        padding-top:6px;
      }
    }
    .slideRow{
      display:grid;
      grid-template-columns:auto minmax(0,1fr) auto;
      align-items:center;
      gap:8px;
    }
    .slideViewport{
      min-width:0;
      overflow:hidden;
    }
    .slideNav{
      width:36px;
      height:36px;
      border-radius:999px;
      border:none;
      background:rgba(255,255,255,.78);
      color:var(--muted);
      font-size:18px;
      font-weight:700;
      line-height:1;
      cursor:pointer;
      user-select:none;
      display:grid;
      place-items:center;
      padding:0;
      box-shadow: var(--shadow-sm);
    }
    .slideNav[disabled]{
      opacity:.45;
      cursor:default;
    }
    @media (max-width: 760px){
      .slideNav{ display:none; }
      .slideRow{ grid-template-columns:minmax(0,1fr); }
    }
    .slideRow.noOverflow{
      grid-template-columns:minmax(0,1fr);
    }
    .slideRow.noOverflow .slideNav{
      display:none;
    }
    .slideTrack{
      cursor:grab;
      touch-action:auto;
      -webkit-overflow-scrolling:touch;
      overscroll-behavior-x:contain;
    }
    .slideTrack.dragging{
      cursor:grabbing;
      user-select:none;
      scroll-behavior:auto;
    }
    .filterToolbar{
      align-items:center;
      gap:10px;
      flex-wrap:nowrap;
    }
    .liveToolbar{
      justify-content:flex-start;
      gap:12px;
    }
    .liveStatusChip{
      display:inline-flex;
      align-items:center;
      gap:8px;
      min-height:0;
      padding:0;
      color:#52606d;
      font-size:12px;
      font-weight:800;
      white-space:nowrap;
    }
    .liveStatusDot{
      width:10px;
      height:10px;
      border-radius:999px;
      background:var(--orange);
      box-shadow:0 0 0 3px rgba(255,98,0,.12);
      flex:0 0 auto;
    }
    .sortInline{
      display:inline-flex;
      align-items:center;
      gap:8px;
      margin:0;
      min-width:auto;
      color:var(--muted);
      font-size:11px;
      font-weight:800;
      letter-spacing:.02em;
      text-transform:none;
    }
    .sortInline select{
      min-height:36px;
      padding:8px 34px 8px 12px;
      border-radius:12px;
      border:1px solid rgba(15,23,42,.12);
      background:rgba(255,255,255,.92);
      box-shadow:none;
      font-size:12px;
      font-weight:700;
      color:var(--text);
    }
    .sortInline span{
      line-height:1;
      display:none;
    }
    @media (max-width: 760px){
      .top{
        padding:7px 12px 5px;
      }
      .head-title{
        font-size:clamp(23px, 7vw, 31px);
      }
      .head-sub{
        font-size:10px;
      }
      .filterToolbar{
        align-items:center;
      }
      .liveToolbar{
        flex-wrap:nowrap;
      }
      .sortInline{
        width:auto;
      }
    }
    @media (max-width: 640px){
      .filterToolbar,
      .liveToolbar{
        flex-wrap:wrap;
        align-items:stretch;
      }
      .liveStatusChip{
        white-space:normal;
      }
      .sortInline{
        width:100%;
        justify-content:space-between;
      }
      .sortInline select{
        width:100%;
        min-width:0;
        max-width:100%;
      }
    }
    .promoImageBanner{
      position:relative;
      overflow:hidden;
      width:100vw;
      margin-left:calc(50% - 50vw);
      background:linear-gradient(180deg, rgba(255,255,255,.94) 0%, rgba(255,255,255,.84) 100%);
      box-shadow:
        0 0 0 1px rgba(255,98,0,.08),
        0 0 42px rgba(255,98,0,.16),
        0 18px 34px rgba(17,24,39,.14),
        0 6px 18px rgba(17,24,39,.08);
      border-top:1px solid rgba(24,24,24,.06);
      border-bottom:1px solid rgba(24,24,24,.06);
    }
    .promoImageBanner::after{
      content:"";
      position:absolute;
      inset:0;
      background:linear-gradient(180deg, rgba(0,0,0,.04) 0%, rgba(0,0,0,.10) 100%);
      pointer-events:none;
    }
    .promoImageBanner img{
      display:block;
      width:100%;
      height:auto;
      max-height:320px;
      object-fit:cover;
      object-position:center;
    }
    @media (max-width: 760px){
      .promoImageBanner img{
        max-height:220px;
      }
    }
    .dailySecretBanner{
      position:relative;
      overflow:visible;
      width:100vw;
      margin-left:calc(50% - 50vw);
      margin-bottom:48px;
    }
    .dailySecretHero{
      position:relative;
      padding:0;
      background:transparent;
      min-height:340px;
      max-height:340px;
      overflow:hidden;
      border-radius:0;
      box-shadow:none;
    }
    .dailySecretHero::after{
      content:"";
      position:absolute;
      inset:0;
      background:linear-gradient(90deg, rgba(16,10,12,.62) 0%, rgba(16,10,12,.30) 36%, rgba(16,10,12,.08) 68%, rgba(16,10,12,.18) 100%);
      pointer-events:none;
      z-index:2;
    }
    .dailySecretHeroArt{
      position:relative;
      z-index:1;
      width:100%;
      margin:0;
    }
    .dailySecretHeroArt img{
      display:block;
      width:100%;
      height:100%;
      max-height:340px;
      object-fit:cover;
      object-position:center top;
      filter:none;
    }
    .dailySecretCopy{
      position:absolute;
      left:24px;
      top:26px;
      z-index:3;
      max-width:400px;
      color:#fff;
      text-shadow:0 10px 24px rgba(8,8,10,.32);
    }
    .dailySecretEyebrow{
      display:inline-flex;
      align-items:center;
      min-height:34px;
      padding:0 12px;
      border-radius:999px;
      border:1px solid rgba(255,255,255,.22);
      background:rgba(255,255,255,.14);
      backdrop-filter:blur(8px);
      font-size:11px;
      font-weight:800;
      letter-spacing:.06em;
      text-transform:uppercase;
    }
    .dailySecretTitle{
      display:block;
      margin-top:14px;
      max-width:12ch;
      font-size:clamp(30px, 4.6vw, 48px);
      line-height:.95;
      letter-spacing:-.05em;
      font-weight:900;
    }
    .dailySecretText{
      margin:12px 0 0;
      max-width:34ch;
      font-size:13px;
      line-height:1.42;
      color:rgba(255,255,255,.92);
    }
    .dailySecretOverlay{
      position:relative;
      z-index:4;
      margin-top:-368px;
      padding:0 24px;
      pointer-events:none;
    }
    .dailySecretRail{
      padding:0;
      gap:12px;
      pointer-events:auto;
    }
    .dailySecretRail > .dealCard{
      width:224px;
      flex:0 0 224px;
      background:#fff;
      border:1px solid rgba(15,23,42,.06);
      border-radius:18px;
      box-shadow:0 16px 28px rgba(17,24,39,.16);
      backdrop-filter:none;
    }
    .dailySecretRail > .dealCard .dealMedia{
      height:132px;
      background:#fff;
    }
    .dailySecretRail > .dealCard .dealBody{
      padding:10px;
      background:#fff;
    }
    .dailySecretRail > .dealCard .dealTitle{
      font-size:14px;
    }
    .dailySecretRail > .dealCard .dealAction{
      min-height:36px;
      font-size:12px;
    }
    @media (max-width: 760px){
      .dailySecretBanner{
        margin-bottom:34px;
      }
      .dailySecretHero{
        padding:0;
        min-height:0;
        max-height:none;
        background:linear-gradient(180deg, #6d0914 0%, #4e0610 100%);
      }
      .dailySecretHeroArt{
        width:100%;
      }
      .dailySecretHeroArt img{
        height:auto;
        max-height:none;
        object-fit:fill;
        object-position:center center;
      }
      .dailySecretCopy{
        left:14px;
        top:16px;
        max-width:210px;
      }
      .dailySecretTitle{
        margin-top:10px;
        font-size:clamp(22px, 7.2vw, 30px);
      }
      .dailySecretText{
        display:none;
      }
      .dailySecretOverlay{
        margin-top:-282px;
        padding:0 12px;
      }
      .dailySecretRail{
        gap:8px;
      }
      .dailySecretRail > .dealCard{
        width:min(224px, calc(100vw - 36px));
        flex:0 0 min(224px, calc(100vw - 36px));
        border-radius:16px;
      }
      .dailySecretRail > .dealCard .dealMedia{
        height:132px;
      }
      .dailySecretRail > .dealCard .dealBody{
        padding:8px;
      }
    }
    @media (max-width: 480px){
      .dailySecretBanner{
        margin-bottom:28px;
      }
      .dailySecretHero{
        min-height:0;
        max-height:none;
        background:linear-gradient(180deg, #630813 0%, #43050d 100%);
      }
      .dailySecretHero::after{
        background:linear-gradient(180deg, rgba(16,10,12,.20) 0%, rgba(16,10,12,.12) 30%, rgba(16,10,12,.44) 100%);
      }
      .dailySecretHeroArt img{
        height:auto;
        max-height:none;
        object-fit:fill;
        object-position:center center;
      }
      .dailySecretCopy{
        left:12px;
        right:12px;
        top:14px;
        max-width:190px;
      }
      .dailySecretEyebrow{
        min-height:30px;
        padding:0 10px;
        font-size:10px;
      }
      .dailySecretTitle{
        margin-top:8px;
        max-width:10ch;
        font-size:24px;
        line-height:.98;
      }
      .dailySecretText{
        display:none;
      }
      .dailySecretOverlay{
        margin-top:-236px;
        padding:0 10px;
      }
      .dailySecretRail{
        gap:8px;
      }
      .dailySecretRail > .dealCard{
        width:min(224px, calc(100vw - 36px));
        flex:0 0 min(224px, calc(100vw - 36px));
        border-radius:15px;
      }
      .dailySecretRail > .dealCard .dealMedia{
        height:132px;
      }
      .dailySecretRail > .dealCard .dealBody{
        padding:7px;
      }
      .dailySecretRail > .dealCard .dealTitle{
        font-size:12px;
      }
      .dailySecretRail > .dealCard .dealAction{
        min-height:32px;
        font-size:11px;
      }
    }
    .catChip{
      flex:0 0 auto;
      display:inline-flex;
      flex-direction:column;
      align-items:center;
      justify-content:flex-start;
      gap:6px;
      min-width:72px;
      min-height:76px;
      padding:4px 4px 7px;
      border:none;
      border-radius:0;
      background:transparent;
      box-shadow:none;
      font-weight:700;
      font-size:12px;
      cursor:pointer;
      user-select:none;
      text-align:center;
      scroll-snap-align:start;
      transition: background .16s ease, color .16s ease, transform .16s ease, box-shadow .16s ease;
    }
    .catChip .ico{
      width:48px;
      height:48px;
      position:relative;
      border-radius:50%;
      display:grid;
      place-items:center;
      overflow:hidden;
      background:linear-gradient(180deg, rgba(255,255,255,.98) 0%, rgba(247,247,247,.94) 100%);
      box-shadow:0 6px 14px rgba(24,24,24,.06);
      color: var(--cat-fg, inherit);
      transition: color .16s ease, transform .16s ease, box-shadow .16s ease;
    }
    .catChip .ico::after{
      content:"";
      position:absolute;
      inset:0;
      border-radius:50%;
      box-shadow:
        inset 0 0 0 2px #fffdf8,
        inset 0 0 0 4px #efe1d0;
      pointer-events:none;
      z-index:2;
    }
    .catChip .ico svg{
      width:22px;
      height:22px;
      display:block;
      stroke-linecap:round;
      stroke-linejoin:round;
      stroke-width:1.8;
    }
    .catChip .ico img{
      width:84%;
      height:84%;
      display:block;
      object-fit:contain;
      object-position:center;
      filter:none;
    }
    .catChip .ico img.catIconFood{
      width:86%;
      height:86%;
    }
    .catChip .ico img.catIconDrinks{
      width:86%;
      height:86%;
    }
    .catChip .ico img.catIconAll{
      width:90%;
      height:90%;
      border-radius:50%;
    }
    .catChip .ico img.catIconBrand{
      object-fit:contain;
      border-radius:12px;
    }
    .catChip .ico img.catIconDrugstore,
    .catChip .ico img.catIconHome{
      width:78%;
      height:78%;
    }
    .catChip .ico img.catIconPet{
      width:88%;
      height:88%;
    }
    .catChip .label{
      display:block;
      font-size:10px;
      line-height:1.1;
      font-weight:600;
      letter-spacing:.01em;
      max-width:100%;
      overflow:hidden;
      text-overflow:ellipsis;
      white-space:normal;
      color:#5a606d;
      text-wrap:balance;
    }
    .catChip.active{
      color:var(--accent);
      background:transparent;
      box-shadow:none;
    }
    .catChip.active .ico{
      color:var(--accent);
      background:linear-gradient(180deg, #fffefe 0%, #fff5f6 100%);
      box-shadow:0 8px 16px rgba(255,98,0,.11);
    }
    .catChip.active .ico::after{
      box-shadow:
        inset 0 0 0 2px #fffdf8,
        inset 0 0 0 4px #efd7d9;
    }
    .catChip.active .label{
      color:#F15A24;
      font-weight:600;
    }
    .searchrow{ display:flex; gap:10px; }
    .searchrow input{ flex:1; min-width:0; }
    .dashboardSearchWrap{
      width:100vw;
      margin:18px 0 18px calc(50% - 50vw);
      padding:14px clamp(16px, 3vw, 28px);
      border-radius:0;
      background:var(--brand-warm);
      box-shadow:0 16px 34px rgba(255,98,0,.16);
    }
    .dashboardSearchRow{
      align-items:center;
      gap:12px;
      width:min(100%, var(--content-max));
      margin:0 auto;
    }
    .dashboardSearchRow input{
      background:#ffffff;
      border-color:rgba(255,255,255,.82);
      box-shadow:0 8px 18px rgba(126,43,0,.12);
    }
    .dashboardSearchRow .tag{
      flex:0 0 auto;
      white-space:nowrap;
      background:rgba(255,255,255,.18);
      border-color:rgba(255,255,255,.28);
      color:#ffffff;
    }
    .favoritesHero{
      padding:18px;
      border-radius:22px;
      background:#fff;
      border:1px solid rgba(24,24,24,.06);
      box-shadow:0 10px 24px rgba(17,24,39,.05);
    }
    .favoritesHeroTop{
      display:flex;
      align-items:flex-start;
      justify-content:space-between;
      gap:14px;
      flex-wrap:wrap;
    }
    .favoritesEyebrow{
      display:inline-flex;
      align-items:center;
      padding:6px 10px;
      border-radius:999px;
      background:#f3f4f6;
      color:#4b5563;
      font-size:11px;
      font-weight:700;
      letter-spacing:.04em;
      text-transform:uppercase;
    }
    .favoritesTitle{
      margin-top:10px;
      font-size:clamp(24px, 3.2vw, 32px);
      line-height:1.08;
      letter-spacing:-.03em;
      font-weight:800;
      color:#202020;
      max-width:18ch;
    }
    .favoritesSub{
      margin-top:8px;
      max-width:58ch;
      font-size:13px;
      line-height:1.45;
      color:#6b7280;
    }
    .favoritesHeroActions{
      display:flex;
      gap:8px;
      flex-wrap:wrap;
      align-items:center;
    }
    .favoritesSummaryRow{
      display:flex;
      gap:10px;
      flex-wrap:wrap;
      margin-top:16px;
    }
    .favoritesSummaryChip{
      display:grid;
      gap:3px;
      min-width:110px;
      padding:10px 12px;
      border-radius:14px;
      background:#f8fafc;
      border:1px solid rgba(24,24,24,.06);
      box-shadow:none;
    }
    .favoritesSummaryChip span{
      font-size:11px;
      font-weight:700;
      letter-spacing:.03em;
      text-transform:uppercase;
      color:#6b7280;
    }
    .favoritesSummaryChip b{
      font-size:22px;
      line-height:1;
      letter-spacing:-.03em;
      color:#202020;
    }
    .favoritesUtility,
    .favoritesPanel,
    .favoritesCollection{
      padding:16px;
      border-radius:20px;
      background:#fff;
      border:1px solid rgba(24,24,24,.06);
      box-shadow:0 8px 20px rgba(17,24,39,.04);
    }
    .favoritesSectionHead{
      display:flex;
      align-items:flex-start;
      justify-content:space-between;
      gap:12px;
      flex-wrap:wrap;
      margin-bottom:14px;
    }
    .favoritesSearchRow{
      align-items:stretch;
      flex-wrap:wrap;
    }
    .favoritesSearchRow input{
      min-height:40px;
      border-radius:14px;
    }
    .favoritesManageRow{
      display:grid;
      gap:8px;
      margin-bottom:12px;
    }
    .favoritesManageTop{
      display:flex;
      justify-content:flex-end;
    }
    .favoritesCompactActions{
      justify-content:flex-end;
      flex-wrap:wrap;
    }
    .favoritesCompactActions .btn{
      min-height:44px;
      padding-inline:14px;
    }
    .favoritesWatchGrid{
      display:grid;
      grid-template-columns:1fr;
      gap:10px;
    }
    .favoritesWatchCard{
      display:flex;
      flex-direction:column;
      gap:12px;
      align-items:stretch;
      padding:12px 14px;
      border-radius:14px;
      background:#fafafa;
      border:1px solid rgba(24,24,24,.06);
    }
    .favoritesWatchCard > div:last-child{
      justify-content:flex-start;
    }
    .favoritesWatchCard b{
      display:block;
      font-size:15px;
      line-height:1.15;
      word-break:break-word;
    }
    .favoritesWatchCard span{
      display:block;
      margin-top:4px;
      font-size:12px;
      line-height:1.4;
      color:#6b6b6b;
      word-break:break-word;
    }
    .favoritesTinyAction{
      min-height:34px;
      padding:8px 10px;
      border:none;
      border-radius:10px;
      background:#f3f4f6;
      color:#4f5965;
      font-weight:600;
      cursor:pointer;
    }
    .favoritesStoreGrid{
      display:grid;
      grid-template-columns:repeat(auto-fit, minmax(180px, 1fr));
      gap:12px;
    }
    .favoritesStoreCard{
      position:relative;
      display:grid;
      gap:8px;
      min-height:150px;
      padding:14px;
      border:none;
      border-radius:22px;
      text-align:left;
      cursor:pointer;
      background:
        radial-gradient(70% 70% at 100% 0%, rgba(81,21,181,.12), transparent 50%),
        linear-gradient(180deg, #fff 0%, #f7f8fb 100%);
      box-shadow: inset 0 0 0 1px rgba(24,24,24,.06);
      color:#202020;
    }
    .favoritesStoreCard.active{
      background:
        radial-gradient(70% 70% at 100% 0%, rgba(81,21,181,.18), transparent 50%),
        linear-gradient(180deg, #fff7f8 0%, #fff 100%);
      box-shadow:
        inset 0 0 0 1px rgba(255,98,0,.12),
        0 12px 26px rgba(17,24,39,.08);
    }
    .favoritesStoreTop{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:8px;
    }
    .favoritesStoreMark{
      width:38px;
      height:38px;
      border-radius:14px;
      display:grid;
      place-items:center;
      background:#eef4fb;
      color:#5115B5;
      font-size:12px;
      font-weight:800;
    }
    .favoritesStoreCount{
      font-size:11px;
      font-weight:800;
      color:#6c6c6c;
      letter-spacing:.04em;
      text-transform:uppercase;
    }
    .favoritesStoreCard b{
      font-size:17px;
      line-height:1.1;
    }
    .favoritesStoreCard span{
      font-size:12px;
      line-height:1.4;
      color:#666;
    }
    .favoritesStorePinned{
      display:inline-flex;
      width:max-content;
      padding:6px 9px;
      border-radius:999px;
      background:#e9f6ef;
      color:#15803d;
      font-size:11px;
      font-weight:800;
    }
    .favoritesStoreRemove{
      position:absolute;
      top:10px;
      right:10px;
      width:28px;
      height:28px;
      display:grid;
      place-items:center;
      border-radius:999px;
      background:#f3f4f6;
      color:#6b7280;
      font-size:18px;
      line-height:1;
    }
    .favoritesSpotlightGrid{
      display:grid;
      grid-template-columns:minmax(0, 1.55fr) minmax(280px, 1fr);
      gap:14px;
      align-items:start;
    }
    .favoritesSpotlightBlock,
    .favoritesChecklist{
      min-width:0;
    }
    .favoritesMiniHead{
      display:flex;
      align-items:flex-end;
      justify-content:space-between;
      gap:10px;
      margin-bottom:10px;
    }
    .favoritesMiniHead b{
      font-size:15px;
      line-height:1.1;
      color:#202020;
    }
    .favoritesMiniHead span{
      font-size:12px;
      color:#6b6b6b;
    }
    .favoritesMiniRail{
      padding-bottom:4px;
    }
    .favoritesChecklist{
      padding:0;
      border-radius:0;
      background:transparent;
      box-shadow:none;
    }
    .favoritesChecklistItem{
      width:100%;
      display:grid;
      gap:4px;
      text-align:left;
      padding:12px 13px;
      margin-bottom:8px;
      border:none;
      border-radius:14px;
      background:#fafafa;
      box-shadow: inset 0 0 0 1px rgba(24,24,24,.06);
      cursor:pointer;
    }
    .favoritesChecklistItem:last-child{
      margin-bottom:0;
    }
    .favoritesChecklistItem b{
      font-size:14px;
      line-height:1.15;
      color:#202020;
    }
    .favoritesChecklistItem span{
      font-size:12px;
      line-height:1.4;
      color:#666;
    }
    .favoritesChecklistItem.compact{
      background:#fcfcfd;
    }
    .favoritesCollectionRail{
      padding-top:4px;
    }
    .favoritesEmptyState{
      display:grid;
      justify-items:start;
      gap:10px;
      padding:22px 18px;
      border-radius:18px;
      background:#fafafa;
      box-shadow: inset 0 0 0 1px rgba(24,24,24,.05);
    }
    .favoritesEmptyBadge{
      display:inline-flex;
      align-items:center;
      padding:7px 11px;
      border-radius:999px;
      background:#FFF1E6;
      color:#F15A24;
      font-size:11px;
      font-weight:800;
      letter-spacing:.06em;
      text-transform:uppercase;
    }
    .favoritesEmptyTitle{
      font-size:24px;
      line-height:1.08;
      letter-spacing:-.03em;
      font-weight:900;
      color:#202020;
      max-width:18ch;
    }
    .favoritesEmptyText{
      max-width:48ch;
      font-size:14px;
      line-height:1.5;
      color:#686868;
    }
    .favoritesEmptyActions{
      display:flex;
      gap:10px;
      flex-wrap:wrap;
      margin-top:4px;
    }
    @media (max-width: 920px){
      .favoritesSpotlightGrid{
        grid-template-columns:1fr;
      }
    }
    @media (max-width: 620px){
      .favoritesHero,
      .favoritesUtility,
      .favoritesPanel,
      .favoritesCollection{
        padding:16px;
        border-radius:22px;
      }
      .favoritesTitle{
        max-width:unset;
      }
      .favoritesSummaryChip{
        width:calc(50% - 5px);
      }
      .favoritesStoreGrid,
      .favoritesWatchGrid{
        grid-template-columns:1fr;
      }
      .favoritesSearchRow > *{
        width:100%;
      }
      .favoritesManageRow{
        grid-template-columns:1fr;
      }
      .favoritesManageTop{
        justify-content:flex-start;
      }
      .favoritesCompactActions{
        justify-content:stretch;
      }
      .favoritesCompactActions .btn{
        flex:1 1 0;
      }
      .favoritesStoreCard{
        min-height:136px;
      }
      .favoritesSummaryChip{
        width:100%;
      }
    }
    .list{ display:grid; gap:14px; }
.item{
  border-radius: 28px;
  background:rgba(255,255,255,.97);
  padding:14px;
      box-shadow:0 18px 34px rgba(15,23,42,.07);
      cursor:pointer;
      transition:transform .16s ease, box-shadow .16s ease, opacity .16s ease;
      position:relative;
  overflow:hidden;
  border:1px solid rgba(15,23,42,.07);
    }
.item:has(.itemDiscountRibbon){
  overflow:visible;
}
    .item:hover{ box-shadow:0 22px 40px rgba(15,23,42,.09); }
    .item:active{ transform: scale(.985); opacity:.97; }
.itop{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:12px 14px;
      align-items:start;
    }
.thumb{
  grid-column:1 / -1;
  width:100%;
  height:auto;
  min-height:210px;
  aspect-ratio:1 / .82;
  border-radius:22px;
      background: linear-gradient(180deg, #f5f5fb 0%, #efeff6 100%);
      overflow:hidden;
      display:flex;
      align-items:center;
      justify-content:center;
      box-shadow: inset 0 0 0 1px rgba(15,23,32,.04);
    }
    .itemCopy{
      min-width:0;
      align-self:start;
    }
    .itemTrustRow{
      display:flex;
      flex-wrap:wrap;
      gap:6px;
      margin-top:6px;
    }
    .thumb img{
      width:100%;
      height:100%;
      border-radius:inherit;
      object-fit:contain;
      object-position:center;
      display:block;
      padding:14px;
      background:transparent;
    }
    .thumbPlaceholder{
      width:100%;
      height:100%;
      display:grid;
      place-items:center;
      padding:0;
      background:#ffffff;
    }
    .thumbPlaceholder img,
    .dealFallback img{
      width:100%;
      height:100%;
      object-fit:cover;
      display:block;
    }
    .groupFocusFallback img{
      width:min(100%, 180px);
      height:auto;
      object-fit:contain;
      display:block;
    }
    .thumbPlaceholderIcon{
      display:grid;
      place-items:center;
      width:64px;
      height:64px;
      border-radius:18px;
      background:rgba(207,210,223,.42);
      color:#9aa2af;
      line-height:0;
    }
    .thumbPlaceholderIcon svg{
      width:30px;
      height:30px;
      stroke:currentColor;
      fill:none;
      stroke-width:1.8;
      stroke-linecap:round;
      stroke-linejoin:round;
    }
.proofThumb{
  margin-top:8px;
  width:88px;
  height:88px;
  border-radius:12px;
      overflow:hidden;
      background:#f1f1f1;
      box-shadow: inset 0 0 0 1px rgba(15,23,32,.06);
    }
    .proofThumb img{
      width:100%;
      height:100%;
      object-fit:contain;
      object-position:center;
      display:block;
      padding:2px;
      background:rgba(255,255,255,.82);
    }
    .scannerWrap{
      border-radius:18px;
      background:#111;
      overflow:hidden;
      min-height:280px;
      position:relative;
      box-shadow:none;
      border:1px solid rgba(255,255,255,.08);
      isolation:isolate;
    }
    .scannerVideo{
      width:100%;
      height:320px;
      object-fit:cover;
      display:block;
    }
    .scannerFallback{
      display:none;
      min-height:320px;
      background:#000;
    }
    .scannerFallback video{
      width:100%;
      height:320px;
      object-fit:cover;
    }
    .scannerHint{
      font-size:12px;
      color:var(--muted);
      margin-top:8px;
      line-height:1.35;
    }
    .scanOverlay{
      position:absolute;
      inset:0;
      pointer-events:none;
      opacity:0;
      transition:opacity .2s ease;
      background:
        radial-gradient(120% 80% at 50% 0%, rgba(255,255,255,.04), transparent 42%),
        linear-gradient(180deg, rgba(255,98,0,.12) 0%, rgba(255,98,0,0) 22%, rgba(0,0,0,0) 100%);
    }
    .scannerWrap.scanning .scanOverlay{ opacity:1; }
    .scanFrame{
      position:absolute;
      left:6%;
      right:6%;
      top:14%;
      bottom:14%;
      border:1.5px solid rgba(255,255,255,.88);
      border-radius:22px;
      box-shadow:
        0 0 0 999px rgba(2,6,23,.26),
        inset 0 0 0 1px rgba(255,255,255,.18),
        0 0 26px rgba(255,98,0,.18);
      overflow:hidden;
    }
    .scanFrame::before{
      content:"";
      position:absolute;
      inset:0;
      background:
        linear-gradient(180deg, rgba(255,255,255,.1), rgba(255,255,255,0) 24%, rgba(255,98,0,.08) 100%);
      opacity:.65;
    }
    .scanFrame::after{
      content:"";
      position:absolute;
      inset:14px;
      border:1px solid rgba(255,255,255,.12);
      border-radius:16px;
      box-shadow: inset 0 0 32px rgba(255,98,0,.08);
    }
    .scanFrameCorners{
      position:absolute;
      inset:0;
    }
    .scanFrameCorners span{
      position:absolute;
      width:34px;
      height:34px;
      border-color:#ff5662;
      filter:drop-shadow(0 0 10px rgba(255,72,92,.45));
    }
    .scanFrameCorners span:nth-child(1){
      top:10px;
      left:10px;
      border-top:3px solid currentColor;
      border-left:3px solid currentColor;
      border-top-left-radius:12px;
    }
    .scanFrameCorners span:nth-child(2){
      top:10px;
      right:10px;
      border-top:3px solid currentColor;
      border-right:3px solid currentColor;
      border-top-right-radius:12px;
    }
    .scanFrameCorners span:nth-child(3){
      right:10px;
      bottom:10px;
      border-right:3px solid currentColor;
      border-bottom:3px solid currentColor;
      border-bottom-right-radius:12px;
    }
    .scanFrameCorners span:nth-child(4){
      bottom:10px;
      left:10px;
      border-bottom:3px solid currentColor;
      border-left:3px solid currentColor;
      border-bottom-left-radius:12px;
    }
    .scanLine{
      position:absolute;
      left:0;
      right:0;
      top:0;
      height:4px;
      background:
        linear-gradient(90deg, rgba(255,0,0,0), rgba(255,92,92,.96) 18%, rgba(255,255,255,.98) 50%, rgba(255,92,92,.96) 82%, rgba(255,0,0,0));
      box-shadow:
        0 0 10px rgba(255,92,92,.78),
        0 0 24px rgba(255,98,0,.42),
        0 0 44px rgba(255,98,0,.22);
      animation: scanMove 1.6s linear infinite;
    }
    .scanGlow{
      position:absolute;
      left:8%;
      right:8%;
      top:-16%;
      height:42%;
      background:linear-gradient(180deg, rgba(255,74,74,.28), rgba(255,74,74,.08) 44%, rgba(255,74,74,0));
      filter:blur(12px);
      animation: scanMove 1.6s linear infinite;
    }
    @keyframes scanMove{
      0%{ top:0; }
      100%{ top:calc(100% - 5px); }
    }
.ititle{ font-weight:800; font-size:16px; line-height:1.2; letter-spacing:-.03em; color:#343843; }
.itemAside{
  min-width:0;
  display:grid;
  justify-items:end;
  gap:8px;
      align-self:start;
    }
.price{
  font-weight:850;
  font-size:30px;
  color:#F15A24;
      letter-spacing:-.03em;
      text-align:right;
      max-width:100%;
      white-space:nowrap;
    }
.priceWrap{
  display:grid;
  justify-items:end;
  gap:4px;
}
.priceFlag{
  font-size:10px;
  font-weight:800;
  color:var(--discount-ink-strong);
  background:var(--discount-soft);
  padding:5px 9px;
  border-radius:999px;
  border:1px solid var(--discount-border);
  box-shadow: var(--discount-shadow);
  text-transform:uppercase;
  letter-spacing:.02em;
}
.itemDiscountRibbon{
  position:absolute;
  top:-10px;
  right:12px;
  z-index:5;
  min-width:72px;
  height:42px;
  display:flex;
  align-items:center;
  justify-content:center;
  clip-path:polygon(7% 4%, 94% 0%, 100% 91%, 10% 100%);
  background:linear-gradient(135deg, #D64B3E 0%, #B7352B 100%);
  color:var(--discount-ink-strong);
  font-family:var(--font-display);
  font-size:17px;
  font-weight:800;
  line-height:1;
  letter-spacing:0;
  padding:0 14px;
  border:0;
  box-shadow:0 7px 16px rgba(0,0,0,.16);
}
.priceWas{
  display:block;
  font-size:14px;
  color:#8b95a1;
  text-decoration:line-through;
  white-space:nowrap;
  text-align:right;
  line-height:1.1;
}
.isub{
  margin-top:10px;
  font-size:11px;
      color:var(--muted);
      display:flex;
  gap:8px;
      flex-wrap:wrap;
      align-items:center;
    }
.tag{
  font-size:12px;
  padding:8px 12px;
      border-radius:999px;
      background: rgba(241,243,248,.98);
      color: #5f6772;
      box-shadow: inset 0 0 0 1px rgba(20,50,69,.05);
    }
    .dashboardTopBar{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:10px;
      flex-wrap:wrap;
      margin-top:2px;
    }
    .dashboardLocationTag{
      font-size:11px;
      padding:7px 11px;
    }
    .dashboardLiveStatus{
      font-size:11px;
      font-weight:800;
      color:rgba(32,41,55,.72);
    }
    .dashboardControlsPanel{
      padding:10px 12px;
    }
    .controlChip{
      min-height:36px;
      padding:8px 12px;
      border-radius:999px;
      font-size:12px;
      flex:0 0 auto;
    }
    @media (max-width: 640px){
      .dashboardTopBar{
        gap:8px;
      }
      .dashboardLiveStatus{
        width:100%;
        font-size:10px;
      }
      .dashboardControlsPanel{
        padding:8px 10px;
      }
      .filterToolbar{
        gap:6px;
      }
      .sortInline{
        flex:1 1 auto;
        min-width:0;
      }
      .sortInline select{
        width:100%;
      }
      .categoryBar{
        gap:6px;
      }
      .catChip{
        min-width:72px;
        min-height:82px;
        padding:4px 4px 8px;
      }
      .catChip .ico{
        width:50px;
        height:50px;
      }
      .controlChip{
        min-height:34px;
        padding:7px 11px;
      }
    }

/* Final product polish overrides */
.nav{
  background:rgba(255,255,255,.98);
  border-top:1px solid rgba(15,23,42,.08);
  box-shadow:0 -10px 26px rgba(15,23,42,.06);
}
.tab{
  color:#7a8290;
}
.tab.active,
.tab.active .tabIcon{
  color:var(--accent);
}
.fab{
  background:linear-gradient(180deg, #FF7A1A 0%, #F05A00 100%);
  box-shadow:0 12px 26px rgba(240,90,0,.24), 0 0 0 6px rgba(255,255,255,.94);
}
.filterSummaryBlock{
  display:grid;
  grid-auto-rows:max-content;
  align-items:start;
}
.filterSheetCard .filterSummaryEmpty{
  width:min(100%, 360px);
  height:46px;
  min-height:46px;
  max-height:46px;
  padding:0 16px;
  gap:10px;
  border-radius:18px;
  font-size:13px;
  line-height:1;
  align-self:start;
  overflow:hidden;
}
.filterCloseBtn{
  width:38px;
  height:38px;
  box-shadow:none;
}
.filterSectionCard{
  padding:18px;
  border-radius:20px;
}
.filterGeoAction{
  min-height:78px;
}
.filterSheetActions .btn{
  min-height:48px;
  font-size:13px;
}
.filterContextLine{
  color:#687385;
  font-size:12px;
  line-height:1.35;
  font-weight:650;
}
.emptyStateCard{
  border:1px solid rgba(15,23,42,.08);
  background:#fff;
  border-radius:22px;
  box-shadow:0 10px 24px rgba(15,23,42,.045);
}
.emptyStateBadge{
  background:#f5efff;
  color:var(--accent);
  border:1px solid rgba(81,21,181,.10);
}
.emptyStateTitle{
  color:#172033;
  font-size:18px;
  letter-spacing:0;
}
.emptyStateText{
  color:#687385;
}
.emptyStateActions .btn{
  min-height:44px;
}
.toast{
  max-width:min( calc(100vw - 28px), 420px);
  border:1px solid rgba(15,23,42,.08);
  border-radius:16px;
  box-shadow:0 18px 36px rgba(15,23,42,.14);
}
input::placeholder{
  color:#8a93a3;
  opacity:1;
}
input,
select,
textarea{
  border-color:rgba(15,23,42,.10);
}

/* Reliability polish: stable, calm mobile surfaces */
.nav{
  background:rgba(255,255,255,.98);
  border-top:1px solid rgba(15,23,42,.08);
  box-shadow:0 -10px 26px rgba(15,23,42,.06);
}
.tab{
  color:#7a8290;
}
.tab.active,
.tab.active .tabIcon{
  color:var(--accent);
}
.fab{
  background:linear-gradient(180deg, #FF7A1A 0%, #F05A00 100%);
  box-shadow:0 12px 26px rgba(240,90,0,.24), 0 0 0 6px rgba(255,255,255,.94);
}
.filterSheetCard{
  background:#fcfcfd;
  border-color:rgba(15,23,42,.08);
}
.filterSheetHeader{
  margin-bottom:18px;
}
.filterSheetTitle{
  font-size:24px;
}
.filterCloseBtn{
  width:38px;
  height:38px;
  box-shadow:none;
}
.filterSummaryBlock{
  display:grid;
  grid-auto-rows:max-content;
  align-items:start;
  padding-bottom:14px;
}
.filterSheetCard .filterSummaryEmpty{
  width:min(100%, 360px);
  height:46px;
  min-height:46px;
  max-height:46px;
  padding:0 16px;
  gap:10px;
  border-radius:18px;
  font-size:13px;
  line-height:1;
  align-self:start;
}
.filterSummaryEmptyIcon,
.filterSummaryEmptyCheck{
  width:18px;
  height:18px;
}
.filterSummaryEmptyIcon svg,
.filterSummaryEmptyCheck svg{
  width:18px;
  height:18px;
}
.filterSectionCard{
  padding:18px;
  border-radius:20px;
  box-shadow:0 10px 24px rgba(15,23,42,.045);
}
.filterEdgeTitle{
  font-size:18px;
}
.filterHint{
  font-size:13px;
}
.filterGeoAction{
  min-height:78px;
  padding:14px;
  gap:12px;
  border-radius:18px;
}
.filterGeoActionIcon{
  width:46px;
  height:46px;
  border-radius:14px;
}
.filterGeoActionIcon svg{
  width:22px;
  height:22px;
}
.filterGeoActionTitle{
  font-size:14px;
}
.filterGeoActionSub{
  font-size:12px;
}
.filterGeoRadio{
  width:24px;
  height:24px;
  border-width:3px;
}
.filterGeoRadio span{
  width:10px;
  height:10px;
}
.filterOr{
  gap:14px;
  font-size:10px;
}
.filterSelectField{
  min-height:54px;
  padding-left:48px;
  border-radius:16px;
  font-size:13px;
}
.filterSearchIcon{
  left:16px;
  top:27px;
}
.filterSearchIcon svg{
  width:20px;
  height:20px;
}
.filterLocationHint,
.filterRangeLegend{
  font-size:12px;
}
.filterSheetActions{
  gap:10px;
  padding:12px 14px calc(12px + env(safe-area-inset-bottom, 0px));
}
.filterSheetActions .btn{
  min-height:48px;
  border-radius:14px;
  font-size:13px;
}
.filterSheetActions .btn svg{
  width:18px;
  height:18px;
}
button,
input,
select,
textarea{
  -webkit-tap-highlight-color:transparent;
}
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible{
  outline:none;
  box-shadow:0 0 0 4px rgba(81,21,181,.14);
}
.tag.good{ background: rgba(21,128,61,.10); color: rgba(21,128,61,.92); }
.tag.warn{ background: rgba(180,83,9,.10); color: rgba(180,83,9,.92); }
.tag.bad{ background: rgba(185,28,28,.10); color: rgba(185,28,28,.92); }
.tag.reductionTag{
  color:#F15A24;
  background:rgba(255,98,0,.08);
  box-shadow: inset 0 0 0 1px rgba(255,98,0,.14);
}

.iconBtns{ margin-left:0; display:flex; gap:6px; flex-wrap:wrap; justify-content:flex-end; }
    @media (max-width: 560px){
      .itop{
        grid-template-columns:minmax(0,1fr);
      }
      .itemAside{
        grid-column:1;
        width:100%;
        grid-template-columns:minmax(0,1fr) auto;
        align-items:center;
        justify-items:stretch;
      }
      .iconBtns{
        justify-content:flex-start;
      }
      .price{
        justify-self:end;
        font-size:24px;
      }
    }
.iconBtn{
  width:36px; height:36px;
  border-radius:12px;
      border:1px solid rgba(148,163,184,.18);
      background: transparent;
      cursor:pointer;
      display:flex; align-items:center; justify-content:center;
      user-select:none;
      font-weight:700;
      color:var(--muted);
      box-shadow:none;
      transition: transform .16s ease, background .16s ease, color .16s ease, box-shadow .16s ease;
    }
    .iconBtn.active{
      background: transparent;
      color:var(--primary);
      box-shadow: inset 0 0 0 1px rgba(255,98,0,.08);
    }
    .iconBtn[data-act="fav"]{
      color:#c2410c;
    }
    .iconBtn[data-act="fav"].active{
      background: var(--primary-soft);
      color:var(--primary);
    }
    .iconBtn.danger{ background: rgba(185,28,28,.08); color:var(--bad); }
    .iconBtn:active{ transform:scale(.96); }
.iconBtn svg{
  width:16px;
  height:16px;
      stroke:currentColor;
      fill:none;
      stroke-width:2;
      stroke-linecap:round;
      stroke-linejoin:round;
    }
.miniAction{
  min-height:34px;
  padding:7px 10px;
  border-radius:999px;
  font-size:10px;
  display:inline-flex;
  align-items:center;
  gap:6px;
  border:1px solid rgba(24,24,24,.08);
  background:#fff;
  color:var(--muted);
  min-width:0;
    }
.miniAction svg{
  width:14px;
  height:14px;
      stroke:currentColor;
      fill:none;
      stroke-width:2;
      stroke-linecap:round;
      stroke-linejoin:round;
      flex:0 0 auto;
    }
.miniActionGlyph{
  font-size:13px;
      line-height:1;
      font-weight:900;
      flex:0 0 auto;
    }
.miniAction span:last-child{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
    .miniAction.activeVote{
      background:#F1EAFB;
      color:#5115B5;
      border-color:rgba(81,21,181,.18);
    }
    .miniAction.confirmVote.activeVote{
      background:rgba(21,128,61,.10);
      color:rgba(21,128,61,.92);
      border-color:rgba(21,128,61,.18);
    }
    .miniAction.expiredVote.activeVote{
      background:rgba(180,83,9,.10);
      color:rgba(180,83,9,.92);
      border-color:rgba(180,83,9,.18);
    }
    .miniAction.flagVote.activeVote{
      background:rgba(185,28,28,.10);
      color:rgba(185,28,28,.92);
      border-color:rgba(185,28,28,.18);
    }
    .statusCard{
      border-radius:14px;
      background:transparent;
      padding:4px 0 0;
      box-shadow:none;
      border:none;
    }
    .statusTitle{
      font-weight:900;
      font-size:13px;
    }
    .skeleton{
      position:relative;
      overflow:hidden;
      background: rgba(0,0,0,.06);
      border-radius:10px;
      min-height:14px;
    }
    .skeletonDealList{
      align-items:stretch;
    }
    .skeletonDealCard{
      display:flex;
      flex-direction:column;
      overflow:hidden;
      border-radius:20px;
      background:rgba(255,255,255,.92);
      border:1px solid rgba(15,23,42,.05);
      box-shadow:0 12px 24px rgba(15,23,42,.05);
    }
    .skeletonDealMedia{
      height:150px;
      border-radius:0;
    }
    .skeletonDealBody{
      display:grid;
      gap:10px;
      padding:14px;
    }
    .skeletonDealTitle{
      height:18px;
      width:72%;
    }
    .skeletonDealPrice{
      height:28px;
      width:44%;
    }
    .skeletonDealMeta{
      height:12px;
      width:88%;
    }
    .skeletonDealMeta.short{
      width:62%;
    }
    .skeleton::after{
      content:"";
      position:absolute;
      inset:0;
      transform: translateX(-100%);
      background: linear-gradient(90deg, transparent, rgba(255,255,255,.6), transparent);
      animation: skeletonSweep 1.15s linear infinite;
    }
    @keyframes skeletonSweep{
      100%{ transform: translateX(100%); }
    }

    /* Bottom navigation */
    .nav{
      position:fixed; left:0; right:0; bottom:0;
      background:rgba(255,255,255,.96);
      backdrop-filter: blur(22px) saturate(1.02);
      box-shadow:
        0 -12px 30px rgba(15,23,42,.07),
        0 1px 0 rgba(255,255,255,.86) inset;
      padding:12px clamp(16px, 4vw, 28px) calc(12px + env(safe-area-inset-bottom, 0px));
      z-index:30;
      border-top:1px solid rgba(15,23,42,.08);
    }
    .tabs{
      width:min(100%, 760px);
      max-width:none;
      margin:0 auto;
      display:grid;
      grid-template-columns:repeat(4,1fr);
      gap:8px;
      align-items:end;
    }
    .tab{
      position:relative;
      padding:10px 8px 9px;
      min-height:64px;
      border-radius:18px;
      border:none;
      background:transparent;
      color: #7b8492;
      cursor:pointer;
      font-weight:800;
      font-size:12px;
      display:flex;
      flex-direction:column;
      align-items:center;
      justify-content:center;
      gap:7px;
      transition: transform .16s ease, color .16s ease, opacity .16s ease, background .16s ease, box-shadow .16s ease;
    }
    .tab:nth-child(2){
      margin-right:42px;
    }
    .tab:nth-child(3){
      margin-left:42px;
    }
    .tabIcon{
      width:24px;
      height:24px;
      display:flex;
      align-items:center;
      justify-content:center;
      line-height:0;
    }
    .tabIcon svg{
      width:24px;
      height:24px;
      stroke:currentColor;
      fill:none;
      stroke-width:2;
      stroke-linecap:round;
      stroke-linejoin:round;
    }
    .tabLabel{
      display:block;
      line-height:1;
      transform:none;
      letter-spacing:-.01em;
    }
    @media (max-width: 640px){
      .nav{
        padding:10px 10px calc(10px + env(safe-area-inset-bottom, 0px));
      }
      .tabs{
        gap:4px;
      }
      .tab{
        min-height:58px;
        padding:9px 4px 7px;
        font-size:10px;
      }
      .tab:nth-child(2){
        margin-right:34px;
      }
      .tab:nth-child(3){
        margin-left:34px;
      }
      .tabLabel{
        max-width:100%;
        overflow:hidden;
        text-overflow:ellipsis;
        white-space:nowrap;
      }
    }
    @media (max-width: 420px){
      .tabs{
        gap:3px;
      }
      .tab{
        min-height:60px;
        padding:9px 2px 7px;
      }
      .tab:nth-child(2){
        margin-right:26px;
      }
      .tab:nth-child(3){
        margin-left:26px;
      }
      .fab{
        width:62px;
        height:62px;
        bottom:30px;
      }
    }
    @media (max-width: 640px){
      .promoImageBanner,
      .dailySecretBanner,
      .accountHeroFull,
      .accountPanelFull,
      .categoryBannerSection{
        width:calc(100% + 24px);
        max-width:calc(100% + 24px);
        margin-left:-12px;
        margin-right:-12px;
      }
      .categoryBannerBar > div,
      .categoryBannerOverlay{
        width:100%;
        max-width:100%;
      }
    }
    .tab::after{
      content:"";
      position:absolute;
      left:50%;
      bottom:4px;
      width:18px;
      height:3px;
      border-radius:999px;
      background:transparent;
      transform:translateX(-50%);
      transition:background .16s ease, width .16s ease, opacity .16s ease;
      opacity:0;
      display:none;
    }
    .tab.active{
      color:var(--primary);
      background:transparent;
      box-shadow:none;
    }
    .tab.active::after{
      background:transparent;
      width:0;
      opacity:0;
    }
    .tab.active .tabIcon{
      color:var(--primary);
    }
    .tab:focus-visible,
    .btn:focus-visible,
    .iconBtn:focus-visible,
    .slideNav:focus-visible,
    .promoCta:focus-visible,
    .pill:focus-visible{
      outline:none;
      box-shadow: 0 0 0 4px rgba(81,21,181,.16);
    }
    .accountScreen{
      min-height:auto;
      padding:0;
    }
    .feedbackScreen{
      display:grid;
      gap:16px;
      padding-bottom:112px;
    }
    .feedbackHero{
      position:relative;
      overflow:hidden;
      border-radius:28px;
      padding:24px;
      background:
        radial-gradient(circle at top right, rgba(81,21,181,.22), transparent 36%),
        linear-gradient(145deg, #fcf7ef 0%, #eef7fb 100%);
      border:1px solid rgba(81,21,181,.10);
      box-shadow: 0 18px 40px rgba(15, 23, 42, .08);
    }
    .feedbackHero::after{
      content:"";
      position:absolute;
      inset:auto -36px -44px auto;
      width:160px;
      height:160px;
      border-radius:50%;
      background:rgba(81,21,181,.10);
      filter:blur(8px);
    }
    .feedbackBadge{
      display:inline-flex;
      align-items:center;
      gap:8px;
      padding:8px 12px;
      border-radius:999px;
      background:rgba(255,255,255,.82);
      color:#0d566f;
      font-size:11px;
      font-weight:900;
      letter-spacing:.12em;
      text-transform:uppercase;
    }
    .feedbackTitle{
      margin-top:16px;
      font-size:clamp(28px, 5vw, 40px);
      line-height:1.02;
      font-weight:950;
      color:#12303e;
    }
    .feedbackSub{
      margin-top:10px;
      max-width:620px;
      color:#50616c;
      font-size:15px;
      line-height:1.55;
    }
    .feedbackCard{
      display:grid;
      gap:16px;
      background:transparent;
      border:none;
      box-shadow:none;
      padding:0;
      backdrop-filter:none;
    }
    .feedbackInlineCard{
      padding:0;
      background:transparent;
      border:none;
      box-shadow:none;
    }
    .feedbackGrid{
      display:grid;
      grid-template-columns:repeat(2, minmax(0,1fr));
      gap:14px;
    }
    .feedbackField{
      display:grid;
      gap:8px;
    }
    .feedbackField label{
      font-size:13px;
      font-weight:800;
      color:#31414a;
    }
    .feedbackField input,
    .feedbackField textarea{
      width:100%;
      border:1px solid #E0E0E0;
      border-radius:18px;
      background:transparent;
      color:#10212a;
      padding:14px 16px;
      font:inherit;
      outline:none;
      transition:border-color .16s ease, box-shadow .16s ease;
      resize:vertical;
    }
    .feedbackField input:focus,
    .feedbackField textarea:focus{
      border-color:rgba(81,21,181,.45);
      box-shadow:0 0 0 4px rgba(81,21,181,.12);
    }
    .feedbackField textarea{
      min-height:120px;
    }
    .feedbackField.full{
      grid-column:1 / -1;
    }
    .feedbackActions{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:12px;
      flex-wrap:wrap;
    }
    .feedbackHint{
      color:#687983;
      font-size:13px;
      line-height:1.5;
    }
    .feedbackTemporary{
      display:flex;
      align-items:flex-start;
      gap:12px;
      padding:16px 18px;
      border-radius:22px;
      background:#fff7e8;
      border:1px solid rgba(249, 115, 22, .16);
      color:#80451c;
    }
    .feedbackTemporary b{
      display:block;
      margin-bottom:4px;
      color:#7a3414;
    }
    main[data-view="account"]{
      padding:0 0 112px;
      background:#ffffff;
    }
    main[data-view="feedback"]{
      padding:18px 0 112px;
      background:
        radial-gradient(circle at top left, rgba(81,21,181,.06), transparent 24%),
        #ffffff;
    }
    main[data-view="account"] .stack{
      gap:0;
    }
    .accountHeroFull{
      position:relative;
      width:100vw;
      margin-left:calc(50% - 50vw);
      background:
        radial-gradient(36% 42% at 0% 100%, rgba(255,255,255,.06), transparent 52%),
        linear-gradient(180deg, #C35612 0%, #E16314 100%);
      color:#fff;
      padding:14px 0 86px;
      min-height:0;
      overflow:hidden;
    }
    .accountHeroFull::after{
      content:"";
      position:absolute;
      left:0;
      right:0;
      bottom:-1px;
      height:92px;
      background:linear-gradient(180deg, rgba(195,18,32,0) 0%, rgba(195,18,32,.03) 24%, rgba(243,243,243,.78) 70%, #f3f3f3 100%);
      pointer-events:none;
    }
    .accountHeroInner{
      padding:0 clamp(14px, 3vw, 28px);
      max-width:1200px;
      margin:0 auto;
    }
    .accountHeroMeta{
      display:flex;
      justify-content:center;
      margin-bottom:12px;
    }
    .accountGeoBadge{
      display:inline-flex;
      align-items:center;
      max-width:min(82vw, 360px);
      padding:6px 10px;
      border-radius:999px;
      border:1px solid rgba(255,255,255,.18);
      background: rgba(104, 7, 16, .32);
      color:rgba(255,255,255,.98);
      font-size:11px;
      font-weight:700;
      white-space:nowrap;
      overflow:hidden;
      text-overflow:ellipsis;
    }
    .accountHeroTopTitle{
      text-align:center;
      font-size:15px;
      font-weight:800;
      letter-spacing:-.02em;
      color:rgba(255,255,255,.92);
    }
    .accountHeroTitle{
      margin-top:12px;
      font-weight:900;
      font-size:clamp(28px, 6.5vw, 48px);
      line-height:1.04;
      letter-spacing:-.02em;
      color:#fff;
    }
    .accountHeroTitle em{
      color:#111111;
      font-style:normal;
    }
    .accountHeroMail{
      margin-top:6px;
      font-size:11px;
      color:rgba(255,255,255,.84);
      word-break:break-word;
      max-width:34ch;
    }
    .accountHeroStats{
      display:grid;
      grid-template-columns:repeat(3, minmax(0,1fr));
      gap:8px;
      margin-top:12px;
      width:100%;
    }
    .accountHeroStatCard{
      padding:10px 12px;
      border-radius:16px;
      background:rgba(255,255,255,.14);
      border:1px solid rgba(255,255,255,.14);
      backdrop-filter: blur(8px);
    }
    .accountHeroStatCard span{
      display:block;
      font-size:10px;
      font-weight:800;
      letter-spacing:.05em;
      text-transform:uppercase;
      color:rgba(255,255,255,.74);
    }
    .accountHeroStatCard b{
      display:block;
      margin-top:6px;
      font-size:22px;
      line-height:1;
      letter-spacing:-.04em;
      color:#fff;
    }
    .accountQuickGrid{
      margin-top:16px;
      display:grid;
      grid-template-columns:repeat(3, minmax(0,1fr));
      gap:10px;
    }
    .accountQuickBtn{
      border:none;
      background:transparent;
      color:#fff;
      font:inherit;
      text-align:center;
      cursor:pointer;
      padding:0;
    }
    .accountQuickIcon{
      width:64px;
      height:64px;
      margin:0 auto;
      border-radius:999px;
      display:grid;
      place-items:center;
      background:#8F400F;
      box-shadow:none;
    }
    .accountQuickIcon svg{
      width:26px;
      height:26px;
      stroke:#ffffff;
      fill:none;
      stroke-width:1.9;
      stroke-linecap:round;
      stroke-linejoin:round;
    }
    .accountQuickLabel{
      margin-top:8px;
      font-size:11px;
      font-weight:800;
      line-height:1.2;
      color:rgba(255,255,255,.98);
    }
    .accountSheetFx .sheetInner{
      max-width:min(100%, 540px);
      margin:0 auto;
    }
    .accountSheetFx .sheetCard{
      position:relative;
      overflow:hidden;
      border:none;
      background:linear-gradient(180deg, #ffffff 0%, #f6f6f6 100%);
      box-shadow:0 22px 60px rgba(0,0,0,.18);
    }
    .accountSheetFx .sheetCard::before{
      content:"";
      position:absolute;
      left:0;
      right:0;
      top:0;
      height:136px;
      background:linear-gradient(135deg, #B34E0F 0%, #E16314 100%);
      opacity:.98;
      pointer-events:none;
    }
    .accountSheetHeader{
      position:relative;
      z-index:1;
      padding:4px 44px 34px 2px;
      color:#fff;
    }
    .accountSheetEyebrow{
      font-size:11px;
      font-weight:800;
      letter-spacing:.08em;
      text-transform:uppercase;
      color:rgba(255,255,255,.72);
    }
    .accountSheetTitle{
      margin-top:10px;
      font-size:28px;
      line-height:1.05;
      font-weight:900;
      letter-spacing:-.03em;
      color:#fff;
    }
    .accountSheetSub{
      margin-top:8px;
      max-width:38ch;
      color:rgba(255,255,255,.84);
      font-size:13px;
      line-height:1.45;
    }
    .accountSheetBody{
      position:relative;
      z-index:1;
      margin-top:8px;
      display:grid;
      gap:14px;
    }
    .accountSheetBox{
      background:transparent;
      border:none;
      border-radius:0;
      padding:0;
      box-shadow:none;
    }
    .accountSheetBox + .accountSheetBox{
      margin-top:18px;
      padding-top:18px;
      border-top:1px solid #EEEEEE;
    }
    .accountNotifyCard{
      display:grid;
      gap:12px;
      padding:0;
      box-shadow:none;
      border-color:transparent;
    }
    .accountNotifyIntro{
      display:grid;
      gap:4px;
      padding-bottom:4px;
    }
    .accountNotifyIntro b{
      font-weight:var(--fw-title);
      font-size:var(--fs-title);
      line-height:1.25;
      color:var(--fc-title);
    }
    .accountNotifyIntro span{
      font-weight:var(--fw-meta);
      font-size:var(--fs-meta);
      line-height:1.45;
      color:var(--fc-meta);
    }
    .accountSwitchRow{
      display:flex;
      align-items:center;
      gap:14px;
      justify-content:space-between;
      padding:12px 0;
      border-top:1px solid #EEEEEE;
      cursor:pointer;
    }
    .accountSwitchRow.disabled{
      cursor:not-allowed;
      opacity:.62;
    }
    .accountSwitchCopy{
      min-width:0;
      display:grid;
      gap:3px;
    }
    .accountSwitchCopy b{
      font-weight:var(--fw-title);
      font-size:var(--fs-title);
      line-height:1.25;
      color:var(--fc-title);
    }
    .accountSwitchCopy span{
      font-weight:var(--fw-meta);
      font-size:var(--fs-meta);
      line-height:1.4;
      color:var(--fc-meta);
    }
    .accountSwitch{
      position:relative;
      flex:0 0 auto;
      display:inline-flex;
      align-items:center;
      width:52px;
      height:32px;
    }
    .accountSwitch input{
      position:absolute;
      inset:0;
      width:100%;
      height:100%;
      margin:0;
      opacity:0;
      cursor:pointer;
    }
    .accountSwitchSlider{
      position:relative;
      width:52px;
      height:32px;
      border-radius:999px;
      background:#d8dde3;
      transition:background .24s ease;
      box-shadow:inset 0 0 0 1px rgba(24,24,24,.08);
      pointer-events:none;
    }
    .accountSwitchSlider::after{
      content:"";
      position:absolute;
      top:4px;
      left:4px;
      width:24px;
      height:24px;
      border-radius:50%;
      background:#fff;
      box-shadow:0 4px 10px rgba(17,24,39,.18);
      transition:transform .24s cubic-bezier(.2,.8,.2,1);
    }
    .accountSwitch input:checked + .accountSwitchSlider{
      background:#5115B5;
    }
    .accountSwitch input:checked + .accountSwitchSlider::after{
      transform:translateX(20px);
    }
    .accountSwitch input:focus-visible + .accountSwitchSlider{
      outline:2px solid rgba(81,21,181,.28);
      outline-offset:3px;
    }
    .accountSwitch input:disabled{
      cursor:not-allowed;
    }
    .accountSheetBox .hint{
      margin-top:0;
      color:var(--fc-meta);
    }
    .accountSheetRow{
      display:flex;
      align-items:center;
      gap:12px;
      margin-top:14px;
      flex-wrap:wrap;
    }
    .accountPushDebug{
      display:grid;
      gap:8px;
      padding:12px 14px;
      border-radius:16px;
      background:#f7f8fa;
      border:1px solid rgba(15,23,42,.06);
    }
    .accountPushDebugRow{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:12px;
      font-size:12px;
      color:#64748b;
    }
    .accountPushDebugRow b{
      color:#1f2937;
      font-size:12px;
      font-weight:900;
    }
    .accountPushDebugRow code{
      max-width:58%;
      overflow:hidden;
      text-overflow:ellipsis;
      white-space:nowrap;
      font-size:11px;
      font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
      color:#0f172a;
    }
    .accountPushDebugHint{
      font-size:12px;
      line-height:1.4;
      color:#475569;
    }
    .watchlistWrap{
      display:flex;
      flex-wrap:wrap;
      gap:10px;
      margin-top:14px;
    }
    .watchPill{
      display:inline-flex;
      align-items:center;
      gap:8px;
      padding:9px 12px;
      border-radius:999px;
      background:#fff;
      box-shadow: inset 0 0 0 1px rgba(78,13,185,.08);
      color:#2a2a2a;
      font-size:13px;
    }
    .watchPill button{
      width:24px;
      height:24px;
      border:none;
      border-radius:999px;
      background:#f1f1f1;
      cursor:pointer;
      color:#666;
    }
    .accountSheetClose{
      position:absolute;
      top:18px;
      right:18px;
      width:40px;
      height:40px;
      border:none;
      border-radius:999px;
      background:rgba(255,255,255,.16);
      color:#fff;
      font-size:22px;
      line-height:1;
      display:grid;
      place-items:center;
      cursor:pointer;
      z-index:2;
    }
    .accountDangerBtn{
      background:#bc1622;
      color:#fff;
    }
    .accountGhostBtn{
      background:#F1EAFB;
      color:#4E0DB9;
    }
    .accountPanelFull{
      width:100vw;
      margin-left:calc(50% - 50vw);
      margin-top:-54px;
      background:transparent;
      border-radius:34px 34px 0 0;
      position:relative;
      z-index:1;
      box-shadow:none;
    }
    .accountPanelFull::before{
      content:"";
      position:absolute;
      inset:0;
      background:#ffffff;
      border-radius:34px 34px 0 0;
      box-shadow:none;
    }
    .accountPanelInner{
      position:relative;
      z-index:1;
      padding:22px clamp(14px, 3vw, 28px) 0;
      max-width:1200px;
      margin:0 auto;
    }
    .accountSection{
      padding:0 0 12px;
    }
    .accountSection + .accountSection{
      margin-top:18px;
    }
    .accountSectionTitle{
      font-size:var(--fs-headline);
      line-height:1.15;
      letter-spacing:-.03em;
      font-weight:var(--fw-headline);
      color:var(--fc-headline);
      margin-bottom:10px;
    }
    .accountList{
      background:transparent;
    }
    .profileSummaryCard{
      background:transparent;
    }
    .profileSummaryGrid{
      display:grid;
      grid-template-columns:repeat(3, minmax(0,1fr));
      gap:12px;
    }
    .profileMetric{
      display:grid;
      gap:6px;
      padding:14px;
      border-radius:18px;
      background:#fff;
      box-shadow: inset 0 0 0 1px rgba(24,24,24,.05);
    }
    .profileMetric span{
      font-size:11px;
      font-weight:800;
      letter-spacing:.06em;
      text-transform:uppercase;
      color:#6f6f6f;
    }
    .profileMetric b{
      font-size:24px;
      line-height:1.05;
      letter-spacing:-.04em;
      color:#202020;
    }
    .profileMetric small{
      font-size:12px;
      line-height:1.45;
      color:#666;
    }
    .profileActivityList{
      display:grid;
      gap:10px;
    }
    .profileActivityItem{
      display:flex;
      align-items:flex-start;
      justify-content:space-between;
      gap:12px;
      padding:12px 0;
      border-top:1px solid rgba(24,24,24,.08);
    }
    .profileActivityItem:first-child{
      padding-top:0;
      border-top:none;
    }
    .profileActivityItem b{
      display:block;
      font-weight:var(--fw-title);
      font-size:var(--fs-title);
      line-height:1.25;
      color:var(--fc-title);
    }
    .profileActivityItem span{
      display:block;
      margin-top:4px;
      font-weight:var(--fw-meta);
      font-size:var(--fs-meta);
      line-height:1.4;
      color:var(--fc-meta);
    }
    .profileActivityMeta{
      text-align:right;
      min-width:110px;
    }
    .profileActivityMeta strong{
      display:block;
      font-weight:var(--fw-title);
      font-size:16px;
      line-height:1.1;
      color:#5115B5;
    }
    .profileActivityMeta small{
      display:block;
      margin-top:4px;
      font-weight:var(--fw-meta);
      font-size:var(--fs-meta);
      line-height:1.35;
      color:var(--fc-meta);
    }
    .accountRow{
      display:grid;
      grid-template-columns:32px minmax(0,1fr) auto;
      gap:14px;
      align-items:center;
      padding:18px 2px;
      border-bottom:1px solid rgba(24,24,24,.08);
    }
    .accountRow:last-child{
      border-bottom:none;
    }
    .accountRowIcon{
      width:32px;
      height:32px;
      display:grid;
      place-items:center;
      color:#202020;
    }
    .accountRowIcon svg{
      width:28px;
      height:28px;
      stroke:currentColor;
      fill:none;
      stroke-width:1.9;
      stroke-linecap:round;
      stroke-linejoin:round;
    }
    .accountRowMain b{
      display:block;
      font-size:16px;
      line-height:1.15;
      color:#202020;
    }
    .accountRowMain span{
      display:block;
      margin-top:4px;
      font-size:12px;
      color:var(--muted);
      line-height:1.35;
    }
    .accountRowAction{
      color:#9aa1a9;
      font-size:32px;
      line-height:1;
      padding:0 8px 0 0;
    }
    .accountRowButton{
      width:100%;
      border:none;
      background:transparent;
      padding:0;
      text-align:left;
      font:inherit;
      cursor:pointer;
    }
    .accountInlineForm{
      margin-top:12px;
      display:grid;
      gap:10px;
    }
    .accountInlineForm .row{
      gap:8px;
    }
    @media (max-width: 680px){
      .accountSwitchRow{
        align-items:flex-start;
      }
      .accountSwitch{
        margin-top:2px;
      }
      .accountHeroStats,
      .profileSummaryGrid{
        grid-template-columns:1fr;
      }
      .accountQuickGrid{
        grid-template-columns:repeat(3, minmax(0,1fr));
        row-gap:12px;
      }
      .accountQuickIcon{
        width:56px;
        height:56px;
      }
      .accountHeroTitle{
        font-size:clamp(24px, 8vw, 38px);
      }
      .accountSheetTitle{
        font-size:24px;
      }
    }

    .fab{
      position:absolute;
      left:50%;
      right:auto;
      bottom:calc(42px + env(safe-area-inset-bottom, 0px));
      transform:translateX(-50%);
      width:78px;
      height:78px;
      padding:0;
      border-radius:999px;
      border:4px solid rgba(255,255,255,.98);
      background: linear-gradient(180deg, var(--primary) 0%, var(--primary-strong) 100%);
      color:#fff;
      font-size:14px;
      cursor:pointer;
      box-shadow:
        0 12px 26px rgba(140, 10, 22, .18),
        0 2px 0 rgba(255,255,255,.95) inset,
        0 12px 20px rgba(255,255,255,.42);
      display:none;
      align-items:center;
      justify-content:center;
      z-index:35;
      transition: filter .16s ease, box-shadow .16s ease, scale .16s ease;
    }
    .fab::before{
      content:"";
      position:absolute;
      inset:5px;
      border-radius:999px;
      border:1px solid rgba(255,255,255,.18);
      box-shadow: inset 0 10px 14px rgba(255,255,255,.10);
      pointer-events:none;
    }
    .fab:hover{ filter:brightness(1.04); box-shadow: 0 14px 30px rgba(140, 10, 22, .22), 0 2px 0 rgba(255,255,255,.95) inset, 0 10px 18px rgba(255,255,255,.36); }
    .fab:active{ scale:.97; }
    .fab svg{
      width:30px;
      height:30px;
      stroke:currentColor;
      fill:none;
      stroke-width:2;
      stroke-linecap:round;
      stroke-linejoin:round;
    }
    @media (max-width: 640px){
      .fab{
        bottom:calc(32px + env(safe-area-inset-bottom, 0px));
        width:72px;
        height:72px;
      }
      .fab svg{
        width:28px;
        height:28px;
      }
    }

    .toast{
      position:fixed;
      left:50%;
      transform:translate(-50%, 24px);
      bottom:170px;
      width: calc(100% - 28px);
      max-width:440px;
      padding:12px 14px;
      border-radius:16px;
      background: rgba(255,255,255,.86);
      backdrop-filter: blur(18px);
      box-shadow: var(--shadow-lg);
      display:flex;
      z-index:50;
      font-weight:700;
      font-size:13px;
      color: var(--text);
      align-items:center;
      gap:10px;
      opacity:0;
      visibility:hidden;
      pointer-events:none;
      transition: transform .28s cubic-bezier(.22,.8,.18,1), opacity .22s ease, visibility 0s linear .28s;
    }
    .toast[data-tone="success"]{
      background:rgba(240,253,244,.92);
      color:#166534;
      border:1px solid rgba(22,101,52,.12);
    }
    .toast[data-tone="warn"]{
      background:rgba(241,245,249,.94);
      color:#52606d;
      border:1px solid rgba(82,96,109,.16);
    }
    .toast[data-tone="error"]{
      background:rgba(254,242,242,.94);
      color:#b91c1c;
      border:1px solid rgba(185,28,28,.12);
    }
    .toast[data-tone="info"]{
      border:1px solid rgba(15,23,42,.08);
    }
    .toast.show{
      transform:translate(-50%, 0);
      opacity:1;
      visibility:visible;
      transition: transform .28s cubic-bezier(.22,.8,.18,1), opacity .22s ease;
    }
    .toast svg{
      width:18px;
      height:18px;
      stroke:currentColor;
      fill:none;
      stroke-width:2;
      stroke-linecap:round;
      stroke-linejoin:round;
      flex:0 0 auto;
    }

    .scanLayer{
      position:fixed;
      inset:0;
      background:
        radial-gradient(42% 40% at 100% 0%, rgba(81,21,181,.10), transparent 44%),
        radial-gradient(58% 50% at 0% 100%, rgba(255,98,0,.10), transparent 50%),
        rgba(20,20,20,.30);
      backdrop-filter: blur(14px);
      z-index:80;
      opacity:0;
      visibility:hidden;
      pointer-events:none;
      transition: opacity .24s ease, visibility 0s linear .24s;
    }
    .scanLayer.show{
      opacity:1;
      visibility:visible;
      pointer-events:auto;
      transition: opacity .24s ease;
    }
    .scanLayerInner{
      position:absolute;
      left:0;
      right:0;
      bottom:0;
      max-width:min(100%, 1200px);
      margin:0 auto;
      max-height:min(92vh, 900px);
      overflow:auto;
      background:linear-gradient(180deg, #ffffff 0%, #f6f6f6 100%);
      border-bottom:none;
      border-radius:28px 28px 0 0;
      padding:12px 14px calc(120px + env(safe-area-inset-bottom, 0px));
      transform: translateY(100%);
      opacity:0;
      transition: transform .34s cubic-bezier(.22,.8,.18,1), opacity .24s ease;
      will-change: transform, opacity;
      box-shadow: 0 24px 60px rgba(20,20,20,.18);
    }
    .scanLayer.show .scanLayerInner{
      transform: translateY(0);
      opacity:1;
    }
    .scanLayerTop{
      position:sticky;
      top:0;
      z-index:2;
      background:linear-gradient(180deg, rgba(255,255,255,.94) 0%, rgba(255,255,255,.82) 100%);
      backdrop-filter: blur(12px);
      padding:8px 0 12px;
      margin-bottom:12px;
      border-bottom:1px solid rgba(24,24,24,.06);
    }
    .scanLayerTop .title{
      font-size:18px;
      font-weight:950;
    }
    .scanCard{
      background:linear-gradient(180deg, rgba(255,255,255,.96) 0%, rgba(255,255,255,.92) 100%);
      border:1px solid rgba(24,24,24,.06);
      box-shadow:none;
      padding:14px;
    }
    .scanCard .hr{
      background:rgba(24,24,24,.08);
    }
    .scanCard.scannerActive .scanIntro,
    .scanCard.scannerActive .scanActionRow,
    .scanCard.scannerActive .scanModeGrid,
    .scanCard.scannerActive .scanManualEntry,
    .scanCard.scannerActive .scanStepGrid,
    .scanCard.scannerActive .scanPreHr,
    .scanCard.scannerActive .scanPostHr,
    .scanCard.scannerActive .scanMetaHints{
      display:none;
    }
    .scanIntro{
      display:grid;
      gap:6px;
    }
    .scanIntroHero{
      padding:12px 14px;
      border-radius:16px;
      background:
        radial-gradient(58% 72% at 100% 0%, rgba(255,255,255,.12), transparent 58%),
        linear-gradient(135deg, #eff4f7 0%, #e7edf2 100%);
      color:#16202a;
      box-shadow:none;
      border:1px solid rgba(20, 32, 42, .06);
    }
    .scanIntroHero .eyebrow{
      display:inline-flex;
      align-items:center;
      padding:4px 8px;
      border-radius:999px;
      font-size:9px;
      font-weight:800;
      letter-spacing:.08em;
      text-transform:uppercase;
      background:rgba(22,32,42,.05);
      border:1px solid rgba(22,32,42,.08);
      color:#556270;
    }
    .scanIntroHero h3{
      margin:8px 0 2px;
      font-size:clamp(18px, 3vw, 22px);
      line-height:1.08;
      letter-spacing:-.04em;
    }
    .scanIntroHero p{
      margin:0;
      max-width:24ch;
      font-size:12px;
      line-height:1.35;
      color:#66707d;
    }
    .scanActionRow{
      display:flex;
      gap:10px;
      flex-wrap:wrap;
      margin-top:6px;
    }
    .scanActionRow .btn{
      flex:1 1 220px;
      min-height:52px;
      border-radius:18px;
    }
    .scanControls{
      display:none;
      gap:6px;
      flex-wrap:wrap;
      margin-top:10px;
    }
    .scanControls.show{
      display:flex;
    }
    .scanScannerBlock{
      display:none;
    }
    .scanCard.scannerActive .scanScannerBlock{
      display:block;
    }

    .overlay{
      position:fixed; inset:0;
      background: rgba(15,23,32,.34);
      backdrop-filter: blur(8px);
      display:none;
      z-index:60;
    }
    .overlay.show{ display:block; }

    .sheet{
      position:fixed; left:0; right:0; bottom:calc(104px + env(safe-area-inset-bottom, 0px));
      z-index:61;
      display:none;
    }
    .sheet.show{ display:block; }

    .sheetInner{
      max-width:min(100%, 1200px);
      margin:0 auto;
      max-height:calc(100vh - 122px - env(safe-area-inset-bottom, 0px));
      overflow:auto;
      padding:10px clamp(14px, 3vw, 28px) 20px;
    }

    .sheetCard{
      border-radius: 24px;
      background:rgba(255,255,255,.9);
      box-shadow: var(--shadow-lg);
      padding:16px 16px 22px;
      border:1px solid rgba(20,50,69,.05);
      backdrop-filter: blur(12px);
    }
    .filterSheetCard{
      position:relative;
      background:#fbfbfa;
      box-shadow:0 18px 36px rgba(20,20,20,.08);
      padding:14px 14px 96px;
    }
    .filterSheetHeader{
      margin-bottom:10px;
    }
    .filterSheetTitle{
      font-size:18px;
      font-weight:900;
      letter-spacing:-.03em;
      color:var(--text);
    }
    .filterSection{
      display:grid;
      gap:10px;
      padding:14px 0;
      border-top:1px solid rgba(24,24,24,.06);
    }
    .filterSection:first-of-type{
      border-top:none;
      padding-top:4px;
    }
    .filterSectionCard{
      margin-top:10px;
      padding:14px;
      border:none;
      border-radius:18px;
      background:#ffffff;
      box-shadow:
        0 8px 20px rgba(15,23,42,.05),
        inset 0 0 0 1px rgba(15,23,42,.05);
    }
    .filterLabel{
      margin-bottom:0;
      font-size:12px;
      font-weight:700;
      color:#586270;
      letter-spacing:.01em;
    }
    .filterSectionTitle{
      display:block;
      font-size:18px;
      line-height:1.05;
      font-weight:900;
      letter-spacing:-.03em;
      color:#1f2937;
    }
    .filterEdgeTitle{
      display:block;
      margin-left:0;
      width:auto;
      font-size:18px;
      line-height:1.05;
      font-weight:900;
      letter-spacing:-.03em;
      color:#1f2937;
    }
    .filterEdgeRow{
      display:flex;
      align-items:center;
      gap:10px;
      margin-left:0;
      width:auto;
    }
    .filterSectionBody{
      display:grid;
      gap:10px;
    }
    .filterHint{
      font-size:12px;
      line-height:1.4;
      color:#6f7783;
    }
    .filterSummaryBlock{
      display:grid;
      gap:8px;
      padding:0 2px 2px;
    }
    .filterSummaryLabel{
      font-size:10px;
      font-weight:800;
      letter-spacing:.08em;
      text-transform:uppercase;
      color:#94a3b8;
    }
    .filterSummaryEmpty{
      padding:10px 14px;
      border-radius:18px;
      background:linear-gradient(180deg, #f7f8fa 0%, #f1f4f7 100%);
      border:none;
      font-size:13px;
      color:#475569;
      box-shadow:inset 0 0 0 1px rgba(255,255,255,.72);
    }
    .filterSummaryChips,
    .filterChipRow{
      display:flex;
      flex-wrap:wrap;
      gap:8px;
    }
    .filterSummaryChip,
    .filterChoiceChip{
      display:inline-flex;
      align-items:center;
      gap:8px;
      min-height:34px;
      padding:0 12px;
      border-radius:999px;
      border:1px solid rgba(15,23,42,.08);
      background:rgba(255,255,255,.9);
      color:#334155;
      font-size:12px;
      font-weight:900;
      cursor:pointer;
      transition:transform .16s ease, background .16s ease, border-color .16s ease, box-shadow .16s ease, color .16s ease, opacity .16s ease;
    }
    .filterSummaryChip{
      padding:0;
      border:none;
      border-radius:0;
      background:transparent;
      color:#5f3f2b;
      box-shadow:none;
      gap:6px;
    }
    .filterSummaryChipIcon{
      font-size:12px;
      line-height:1;
      opacity:.86;
      flex:0 0 auto;
    }
    .filterSummaryChip:hover,
    .filterChoiceChip:hover{
      transform:translateY(-1px);
      border-color:rgba(127,85,57,.16);
      box-shadow:none;
    }
    .filterChoiceChip.active{
      background:#ffffff;
      border-color:rgba(127,85,57,.34);
      color:#5f3f2b;
      box-shadow:0 8px 18px rgba(127,85,57,.08);
    }
    .filterSummaryChipX{
      width:auto;
      height:auto;
      border-radius:0;
      display:inline-block;
      place-items:unset;
      background:transparent;
      color:#7f5539;
      font-size:16px;
      line-height:1;
      flex:0 0 auto;
    }
    .filterSummaryChip.removing{
      transform:scale(.92);
      opacity:0;
    }
    .filterSectionHead{
      display:flex;
      align-items:flex-end;
      justify-content:flex-start;
      gap:10px;
      padding-left:0;
      margin-left:0;
      width:auto;
    }
    .filterSectionValue{
      font-size:13px;
      font-weight:800;
      color:#243041;
    }
    .filterLocationRow{
      display:grid;
      grid-template-columns:minmax(0, 1fr);
      gap:10px;
      align-items:start;
    }
    .filterSelectWrap{
      position:relative;
    }
    .filterSelectField{
      width:100%;
      min-height:50px;
      padding:0 44px 0 18px;
      border-radius:16px;
      border:none;
      background:#f6f8fa;
      color:#243041;
      font-size:14px;
      font-weight:650;
      outline:none;
      transition:border-color .16s ease, box-shadow .16s ease, background .16s ease;
      box-shadow:inset 0 0 0 1px rgba(148,163,184,.18);
    }
    .filterSelectField:focus{
      box-shadow:0 0 0 4px rgba(81,21,181,.10), inset 0 0 0 1px rgba(255,255,255,.8);
      background:#fff;
    }
    .filterSelectChevron{
      position:absolute;
      top:50%;
      right:14px;
      transform:translateY(-50%);
      color:#8b95a7;
      font-size:15px;
      pointer-events:none;
    }
    .filterGeoAction{
      width:100%;
      min-height:50px;
      padding:0 16px;
      border:none;
      border-radius:16px;
      background:#f6f8fa;
      color:#243041;
      font-size:13px;
      font-weight:700;
      cursor:pointer;
      box-shadow:inset 0 0 0 1px rgba(148,163,184,.18);
      display:flex;
      align-items:center;
      gap:10px;
      text-align:left;
    }
    .filterGeoActionIcon{
      flex:0 0 auto;
      width:16px;
      height:16px;
      display:grid;
      place-items:center;
      line-height:1;
    }
    .filterGeoActionIcon img{
      width:16px;
      height:16px;
      display:block;
      object-fit:contain;
    }
    .filterGeoActionText{
      min-width:0;
      flex:1 1 auto;
    }
    .filterGeoActionChevron{
      flex:0 0 auto;
      color:#94a3b8;
      font-size:14px;
      line-height:1;
    }
    .filterActiveLocation{
      font-size:12px;
      line-height:1.4;
      color:#586270;
      font-weight:700;
    }
    .filterRangeSection{
      gap:10px;
    }
    .filterRangeHead{
      display:flex;
      align-items:center;
      justify-content:flex-start;
      gap:10px;
      padding-left:0;
      margin-left:0;
      width:auto;
    }
    .filterRangeMicro{
      margin-top:4px;
      font-size:12px;
      font-weight:700;
      color:#8a6a55;
    }
    .filterRangeValue{
      margin-left:auto;
      font-size:15px;
      font-weight:800;
      color:#0f172a;
    }
    .filterRangeWrap{
      padding:12px 12px 8px;
      border-radius:16px;
      background:#f6f8fa;
      border:none;
      box-shadow:inset 0 0 0 1px rgba(148,163,184,.16);
    }
    .filterRangeWrap input[type="range"]{
      display:block;
      width:100%;
    }
    .filterRangeLegend{
      display:flex;
      justify-content:space-between;
      gap:8px;
      margin-top:8px;
      padding:0 2px;
      font-size:12px;
      font-weight:700;
      letter-spacing:0;
      text-transform:none;
      color:#64748b;
    }
    .filterToggle{
      width:100%;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:12px;
      padding:12px 14px;
      border-radius:16px;
      border:none;
      background:#f6f8fa;
      color:#243041;
      cursor:pointer;
      transition:background .16s ease, border-color .16s ease, box-shadow .16s ease, transform .16s ease;
      box-shadow:inset 0 0 0 1px rgba(148,163,184,.18);
    }
    .filterToggle:hover{
      transform:translateY(-1px);
      box-shadow:inset 0 0 0 1px rgba(255,255,255,.7), 0 8px 18px rgba(15,23,42,.06);
    }
    .filterToggle.active{
      background:linear-gradient(180deg, #FAF8FF 0%, #F1EAFB 100%);
      box-shadow:inset 0 0 0 1px rgba(139,79,224,.28), 0 8px 18px rgba(81,21,181,.08);
    }
    .filterToggleCopy{
      min-width:0;
      display:grid;
      gap:4px;
      text-align:left;
    }
    .filterToggleHint{
      font-size:11px;
      line-height:1.3;
      color:#64748b;
    }
    .filterToggleTitle{
      display:block;
      font-size:16px;
      line-height:1.1;
      font-weight:850;
      color:#1f2937;
    }
    .filterToggleSwitch{
      width:46px;
      height:28px;
      border-radius:999px;
      background:#d7deea;
      display:flex;
      align-items:center;
      padding:3px;
      flex:0 0 auto;
      transition:background .16s ease;
    }
    .filterToggle.active .filterToggleSwitch{
      background:#8B4FE0;
    }
    .filterToggleKnob{
      width:22px;
      height:22px;
      border-radius:999px;
      background:#fff;
      box-shadow:0 6px 12px rgba(15,23,42,.18);
      transition:transform .16s ease;
    }
    .filterToggle.active .filterToggleKnob{
      transform:translateX(18px);
    }
    .filterSheetActions{
      position:absolute;
      left:0;
      right:0;
      bottom:0;
      margin:0;
      padding:10px 14px calc(10px + env(safe-area-inset-bottom, 0px));
      background:rgba(251,251,250,.94);
      backdrop-filter:blur(12px);
      border-radius:0 0 24px 24px;
      border-top:1px solid rgba(24,24,24,.05);
      box-shadow:0 -10px 24px rgba(15,23,42,.05);
    }
    .filterSheetActions .btn{
      min-height:44px;
      border-radius:14px;
      padding:0 16px;
      box-shadow:none;
    }
    .filterSheetActions .btn.ghost{
      border:1px solid rgba(15,23,42,.08);
      background:#f2f4f5;
      color:#4b5968;
    }
    .filterSheetActions .btn.primary{
      background:#1f2937;
      color:#fff;
      min-width:124px;
    }
    .filterSheetActions.hasReset .btn.primary{
      min-width:120px;
    }
    .filterResetBtn{
      border:none !important;
      background:transparent !important;
      color:#64748b !important;
      text-decoration:underline;
      text-decoration-color:rgba(100,116,139,.4);
      text-underline-offset:3px;
      padding:0 6px !important;
      min-width:auto !important;
    }
    .storeOverlayFx{
      background:
        radial-gradient(80% 70% at 50% 100%, rgba(255,98,0,.18), transparent 60%),
        radial-gradient(52% 46% at 100% 0%, rgba(81,21,181,.16), transparent 40%),
        rgba(20,20,20,.34);
      backdrop-filter: blur(16px) saturate(1.02);
      animation: storeOverlayFade .26s ease;
    }
    .launchHighlightOverlay{
      background:
        radial-gradient(78% 72% at 50% 100%, rgba(255,98,0,.22), transparent 58%),
        radial-gradient(44% 42% at 100% 0%, rgba(81,21,181,.14), transparent 40%),
        rgba(20,20,20,.40);
      backdrop-filter: blur(14px) saturate(1.02);
      animation: storeOverlayFade .24s ease;
    }
    .launchHighlightSheet .sheetInner{
      max-width:min(100%, 720px);
      padding:12px clamp(14px, 3vw, 24px) 10px;
    }
    .launchHighlightSheet .sheetCard{
      border-radius:28px;
      padding:16px;
      background:
        radial-gradient(90% 100% at 100% 0%, rgba(255, 88, 88, .14), transparent 42%),
        linear-gradient(180deg, rgba(255,255,255,.98) 0%, rgba(248,248,248,.96) 100%);
      box-shadow:
        0 24px 60px rgba(20,20,20,.18),
        inset 0 0 0 1px rgba(255,98,0,.08);
      animation: storeSheetUp .32s cubic-bezier(.2,.8,.2,1);
    }
    .launchHighlightTop{
      display:flex;
      align-items:flex-start;
      justify-content:space-between;
      gap:12px;
      margin-bottom:14px;
    }
    .launchHighlightClose{
      width:36px;
      height:36px;
      border:none;
      border-radius:999px;
      background:rgba(20,20,20,.06);
      color:#1f2933;
      font-size:24px;
      line-height:1;
      cursor:pointer;
      display:grid;
      place-items:center;
    }
    .launchHighlightEyebrow{
      font-size:11px;
      font-weight:800;
      letter-spacing:.08em;
      text-transform:uppercase;
      color:#F15A24;
    }
    .launchHighlightTitle{
      margin-top:5px;
      font-size:24px;
      line-height:1.04;
      letter-spacing:-.04em;
      font-weight:900;
      color:#202124;
    }
    .launchHighlightCard{
      width:100%;
      border:none;
      background:
        radial-gradient(100% 120% at 100% 0%, rgba(255,98,0,.08), transparent 44%),
        #ffffff;
      border-radius:22px;
      padding:0;
      overflow:hidden;
      text-align:left;
      box-shadow: 0 12px 28px rgba(20,20,20,.10);
      cursor:pointer;
    }
    .launchHighlightMedia{
      position:relative;
      height:210px;
      background:linear-gradient(160deg, #fff7f0 0%, #eef7ff 100%);
    }
    .launchHighlightMedia img{
      width:100%;
      height:100%;
      object-fit:contain;
      padding:10px;
      display:block;
    }
    .launchHighlightFallback{
      width:100%;
      height:100%;
      display:flex;
      align-items:center;
      justify-content:center;
      color:#66717d;
      font-weight:800;
      letter-spacing:.04em;
    }
    .launchHighlightBadge{
      position:absolute;
      left:12px;
      top:12px;
      display:inline-flex;
      align-items:center;
      min-height:34px;
      padding:8px 12px;
      border-radius:999px;
      background:linear-gradient(135deg, #FF9640 0%, #FF6200 100%);
      color:#fff;
      font-size:14px;
      font-weight:900;
      box-shadow:0 12px 24px rgba(255,98,0,.24);
    }
    .launchHighlightBody{
      padding:14px 14px 16px;
    }
    .launchHighlightMeta{
      font-size:11px;
      color:#6b7280;
    }
    .launchHighlightName{
      margin-top:6px;
      font-size:19px;
      line-height:1.08;
      font-weight:900;
      letter-spacing:-.03em;
      color:#1f2933;
    }
    .launchHighlightStore{
      margin-top:5px;
      font-size:13px;
      color:#495566;
    }
    .launchHighlightPriceRow{
      margin-top:10px;
      display:flex;
      align-items:flex-end;
      gap:10px;
      flex-wrap:wrap;
    }
    .launchHighlightPriceRow strong{
      font-size:28px;
      line-height:.95;
      letter-spacing:-.05em;
      color:#F15A24;
    }
    .launchHighlightPriceRow span{
      font-size:14px;
      color:#8b95a1;
      text-decoration:line-through;
    }
    .launchHighlightHint{
      margin-top:10px;
      font-size:12px;
      font-weight:700;
      color:#5115B5;
    }
    .launchHighlightFav{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      width:34px;
      height:34px;
      padding:0;
      margin-left:auto;
      border-radius:999px;
      border:1px solid rgba(20,20,20,.08);
      background:#fff;
      color:#273444;
      cursor:pointer;
      box-shadow:0 6px 16px rgba(20,20,20,.06);
      flex:0 0 auto;
    }
    .launchHighlightFav.active{
      border-color:rgba(255,98,0,.14);
      background:rgba(255,98,0,.06);
      color:#F15A24;
    }
    .launchHighlightFavIcon{
      width:16px;
      height:16px;
      display:inline-flex;
      align-items:center;
      justify-content:center;
    }
    .launchHighlightFavIcon svg{
      width:16px;
      height:16px;
      display:block;
    }
    .storeSheetFx{
      left:0;
      right:0;
      top:auto;
      bottom:calc(86px + env(safe-area-inset-bottom, 0px));
      z-index:61;
    }
    .storeSheetFx .sheetInner{
      max-width:min(100%, 1200px);
      max-height:calc(100vh - 104px - env(safe-area-inset-bottom, 0px));
      margin:0 auto;
      overflow:auto;
      padding:14px clamp(14px, 3vw, 28px) 10px;
    }
    .storeSheetFx .sheetCard{
      position:relative;
      overflow:hidden;
      border-radius:28px;
      background:
        radial-gradient(120% 120% at 100% 0%, rgba(81,21,181,.08), transparent 42%),
        radial-gradient(90% 80% at 0% 0%, rgba(127,85,57,.08), transparent 38%),
        linear-gradient(180deg, #ffffff 0%, #f5f5f5 100%);
      box-shadow:
        0 24px 60px rgba(20, 20, 20, .14),
        inset 0 0 0 1px rgba(20,20,20,.06);
      animation: storeSheetUp .32s cubic-bezier(.2,.8,.2,1);
    }
    .storeSheetFx .sheetCard::before{
      content:"";
      position:absolute;
      inset:auto 0 0 0;
      height:110px;
      background:linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(81,21,181,.06) 100%);
      pointer-events:none;
    }
    .storeSheetHeader{
      position:sticky;
      top:-16px;
      z-index:3;
      margin:-16px -16px 8px;
      padding:20px 16px 22px;
      border-radius:28px 28px 22px 22px;
      background:
        radial-gradient(42% 58% at 100% 0%, rgba(81,21,181,.10), transparent 54%),
        radial-gradient(36% 52% at 0% 0%, rgba(127,85,57,.10), transparent 44%),
        linear-gradient(180deg, rgba(255,255,255,.98) 0%, rgba(246,246,245,.96) 100%);
      color:#202939;
      box-shadow:
        inset 0 -1px 0 rgba(255,255,255,.80),
        0 10px 22px rgba(15,23,42,.06);
    }
    @media (max-width: 640px){
      .sheet{
        bottom:calc(90px + env(safe-area-inset-bottom, 0px));
      }
      .sheetInner{
        width:100%;
        max-height:calc(100dvh - 102px - env(safe-area-inset-bottom, 0px));
        padding:8px 8px 12px;
      }
      .storeSheetFx .sheetInner{
        max-height:calc(100dvh - 88px - env(safe-area-inset-bottom, 0px));
        padding:8px 8px 12px;
      }
      .sheetCard,
      .filterSheetCard{
        border-radius:20px;
        padding:14px 14px 92px;
      }
      .filterSectionCard{
        padding:14px;
        border-radius:20px;
      }
      .filterSheetActions{
        padding:10px 12px calc(10px + env(safe-area-inset-bottom, 0px));
        border-radius:0 0 20px 20px;
      }
      .filterSheetActions .btn{
        min-height:46px;
      }
      .storeSheetHeader{
        top:-16px;
        padding:18px 14px 18px;
      }
      .groupComparePanel{
        grid-template-columns:1fr;
      }
    }
    .storeSheetEyebrow{
      display:inline-flex;
      align-items:center;
      gap:8px;
      padding:6px 10px;
      border-radius:999px;
      background:rgba(15,23,42,.05);
      border:1px solid rgba(15,23,42,.08);
      font-size:10px;
      font-weight:800;
      letter-spacing:.06em;
      text-transform:uppercase;
      color:#5f6b78;
    }
    .storeSheetTitle{
      margin-top:14px;
      font-size:26px;
      line-height:1.04;
      letter-spacing:-.03em;
      font-weight:900;
      color:#F15A24;
    }
    .storeSheetSub{
      margin-top:8px;
      max-width:42ch;
      font-size:14px;
      line-height:1.45;
      color:#5f6b78;
    }
    .storeSheetMeta{
      margin-top:12px;
      display:flex;
      flex-wrap:wrap;
      gap:8px;
      align-items:center;
      font-size:12px;
      font-weight:800;
      color:#4b5968;
    }
    .storeSheetMetaDivider{
      color:#a0a8b2;
    }
    .storeSheetFx .sheetCard .hr{
      margin:0 0 18px;
      background:linear-gradient(90deg, rgba(127,85,57,.14), rgba(15,23,42,.04));
    }
    .storeSheetClose{
      width:36px;
      height:36px;
      border:none;
      border-radius:999px;
      background:rgba(15,23,42,.05);
      color:#4b5968;
      font-size:24px;
      line-height:1;
      cursor:pointer;
      display:grid;
      place-items:center;
      transition:background .16s ease, color .16s ease, transform .16s ease;
    }
    .storeSheetClose:hover{
      background:rgba(15,23,42,.08);
      color:#1f2937;
    }
    .storeSheetClose:active{
      transform:scale(.97);
    }
    .storeSheetFx .dealRail{
      padding:4px 2px 6px;
      gap:10px;
    }
    .storeSheetFx .dealCard.compactStatic{
      background:linear-gradient(180deg, rgba(255,255,255,.96) 0%, rgba(255,255,255,.9) 100%);
      border:1px solid rgba(15,23,42,.06);
      box-shadow: 0 10px 24px rgba(20,20,20,.08);
    }
    .storeSheetFx .dealCard.compactStatic .dealPrice{
      background:#e8f3fb;
      color:#5115B5;
    }
    .storeSheetFx .dealCard.compactStatic .dealPromoPercent{
      color:var(--discount-ink);
      background:var(--discount-soft);
      border-color:var(--discount-border);
    }
    .storeSheetFx .dealCard.compactStatic .dealSticker{
      background:var(--discount-soft);
      color:var(--discount-ink-strong);
      transform:none;
      border:1px solid var(--discount-border);
      box-shadow: var(--discount-shadow);
    }
    .groupOverlayFx{
      background:
        radial-gradient(78% 68% at 50% 100%, rgba(255,98,0,.08), transparent 58%),
        radial-gradient(44% 40% at 100% 0%, rgba(81,21,181,.08), transparent 42%),
        rgba(20,20,20,.24);
      backdrop-filter: blur(18px) saturate(1.02);
    }
    .groupSheetFx .sheetCard{
      position:relative;
      overflow:hidden;
      border-radius:30px;
      background:
        radial-gradient(120% 120% at 100% 0%, rgba(81,21,181,.06), transparent 42%),
        radial-gradient(90% 80% at 0% 0%, rgba(255,98,0,.04), transparent 38%),
        linear-gradient(180deg, #ffffff 0%, #f7f7f7 100%);
      box-shadow:
        0 24px 60px rgba(20,20,20,.12),
        inset 0 0 0 1px rgba(20,20,20,.05);
    }
    .groupSheetFx .sheetCard::before{
      content:"";
      position:absolute;
      inset:auto 0 0 0;
      height:96px;
      background:linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(81,21,181,.03) 100%);
      pointer-events:none;
    }
    .groupSheetHeader{
      position:sticky;
      top:-16px;
      z-index:3;
      margin:-16px -16px 24px;
      padding:20px 20px 8px;
      border-radius:30px 30px 24px 24px;
      background:
        radial-gradient(42% 58% at 100% 0%, rgba(81,21,181,.08), transparent 54%),
        linear-gradient(180deg, rgba(255,255,255,.96) 0%, rgba(248,248,248,.94) 100%);
      color:#182028;
      box-shadow:
        inset 0 -1px 0 rgba(20,20,20,.04);
    }
    .groupSheetEyebrow{
      display:inline-flex;
      align-items:center;
      gap:8px;
      min-height:28px;
      padding:5px 10px;
      border-radius:999px;
      background:rgba(255,98,0,.08);
      border:1px solid rgba(255,98,0,.10);
      font-size:10px;
      font-weight:700;
      letter-spacing:.08em;
      text-transform:uppercase;
      color:#B34E0F;
    }
    .groupSheetTitle{
      margin-top:14px;
      font-size:var(--fs-headline);
      line-height:1.15;
      letter-spacing:-.02em;
      font-weight:var(--fw-headline);
      color:var(--fc-headline);
    }
    .groupSheetSub{
      margin-top:10px;
      display:flex;
      flex-wrap:wrap;
      gap:8px;
      max-width:52ch;
      font-size:12px;
      color:#7b8794;
    }
    .groupSheetSub span{
      display:inline-flex;
      align-items:center;
      min-height:28px;
      padding:5px 10px;
      border-radius:999px;
      background:rgba(24,24,24,.04);
      border:1px solid rgba(24,24,24,.06);
    }
    .groupSheetFx .sheetCard .hr{
      margin:0 0 24px;
      background:linear-gradient(90deg, rgba(24,24,24,.06), rgba(24,24,24,.02));
    }
    .groupComparePanel{
      display:grid;
      grid-template-columns:minmax(0,1fr);
      gap:10px;
      margin-bottom:16px;
    }
    .groupFocusCard{
      display:grid;
      grid-template-columns:minmax(180px, 260px) minmax(0, 1fr);
      gap:24px;
      align-items:start;
      margin-bottom:24px;
      padding:22px;
      border-radius:28px;
      background:
        radial-gradient(110% 120% at 100% 0%, rgba(81,21,181,.05), transparent 42%),
        linear-gradient(180deg, #ffffff 0%, #fbfbfb 100%);
      box-shadow:
        0 18px 42px rgba(20,20,20,.08),
        inset 0 0 0 1px rgba(24,24,24,.05);
    }
    .groupFocusMedia{
      position:relative;
      aspect-ratio:1/1;
      border-radius:24px;
      overflow:hidden;
      background:linear-gradient(180deg, #f6f6f6 0%, #ececec 100%);
      box-shadow:0 18px 36px rgba(20,20,20,.10);
    }
    .groupFocusMedia:has(.groupFocusRibbon){
      overflow:visible;
    }
    .groupFocusMedia img{
      width:100%;
      height:100%;
      object-fit:contain;
      padding:18px;
      display:block;
      background:#fff;
    }
    .groupFocusMedia:has(.groupFocusRibbon) img{
      border-radius:24px;
    }
    .groupFocusFallback{
      width:100%;
      height:100%;
      display:flex;
      align-items:center;
      justify-content:center;
      padding:14px;
      text-align:center;
      color:#7a7a7a;
      font-weight:700;
      background:linear-gradient(145deg, #f3f3f3, #e8edf2);
    }
    .groupFocusRibbon{
      position:absolute;
      top:-10px;
      right:12px;
      z-index:5;
      min-width:72px;
      height:42px;
      display:flex;
      align-items:center;
      justify-content:center;
      padding:0 14px;
      clip-path:polygon(7% 4%, 94% 0%, 100% 91%, 10% 100%);
      background:linear-gradient(135deg, #D64B3E 0%, #B7352B 100%);
      color:#fff;
      font-family:var(--font-display);
      font-size:17px;
      font-weight:800;
      line-height:1;
      letter-spacing:0;
      border:0;
      box-shadow:0 7px 16px rgba(0,0,0,.16);
    }
    .groupFocusBody{
      display:grid;
      gap:14px;
      align-content:start;
    }
    .groupFocusMetaRow{
      display:flex;
      flex-wrap:wrap;
      gap:10px;
    }
    .groupFocusTag{
      display:inline-flex;
      align-items:center;
      min-height:32px;
      padding:0 12px;
      border-radius:999px;
      background:#f3f5f7;
      color:#58636f;
      font-size:12px;
      font-weight:700;
      border:1px solid rgba(24,24,24,.06);
    }
    .groupFocusTag.neutral{
      background:#f3f5f7;
      color:#58636f;
    }
    .groupFocusTag.best{
      background:rgba(255,98,0,.08);
      color:#B34E0F;
      border-color:rgba(255,98,0,.12);
      box-shadow:none;
    }
    .groupFocusTag.status{
      background:#edf6ef;
      color:#2f7a46;
      border-color:rgba(47,122,70,.10);
    }
    .groupFocusTag.status.expired{
      background:#f6efef;
      color:#9a4b55;
      border-color:rgba(154,75,85,.10);
    }
    .groupFocusName{
      font-size:clamp(24px, 3vw, 32px);
      line-height:1.08;
      letter-spacing:-.035em;
      font-weight:800;
      color:#161616;
      text-wrap:balance;
    }
    .groupFocusPriceRow{
      display:flex;
      align-items:flex-end;
      flex-wrap:wrap;
      gap:12px;
    }
    .groupFocusPrice{
      font-size:clamp(38px, 5.2vw, 56px);
      line-height:.92;
      letter-spacing:-.05em;
      font-weight:900;
      color:#F15A24;
    }
    .groupFocusPrevious{
      font-size:15px;
      font-weight:600;
      color:#99a3ad;
      text-decoration:line-through;
      padding-bottom:8px;
    }
    .groupFocusStoreBlock{
      display:grid;
      gap:6px;
      padding-top:2px;
    }
    .groupFocusStoreName{
      font-size:15px;
      font-weight:700;
      color:#1f2933;
    }
    .groupFocusStoreAddress{
      display:flex;
      align-items:flex-start;
      gap:8px;
      font-size:13px;
      line-height:1.45;
      color:#6c7782;
    }
    .groupFocusStoreIcon{
      flex:0 0 auto;
      color:#97a1ab;
      transform:translateY(1px);
    }
    .groupFocusMetaText{
      display:flex;
      flex-wrap:wrap;
      gap:10px 14px;
      font-size:12px;
      line-height:1.45;
      color:#85909b;
    }
    .groupFocusMetaText span{
      position:relative;
    }
    .groupFocusMetaText span + span::before{
      content:"";
      position:absolute;
      left:-8px;
      top:50%;
      width:4px;
      height:4px;
      border-radius:50%;
      background:rgba(133,144,155,.45);
      transform:translateY(-50%);
    }
    .groupSheetClose{
      width:36px;
      height:36px;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      padding:0;
      border-radius:999px;
      border:1px solid rgba(24,24,24,.08);
      background:rgba(255,255,255,.9);
      color:#51606e;
      box-shadow:0 8px 20px rgba(20,20,20,.06);
      cursor:pointer;
      transition:background .18s ease, color .18s ease, transform .18s ease, border-color .18s ease;
    }
    .groupSheetClose:hover{
      background:#fff;
      color:#182028;
      border-color:rgba(24,24,24,.12);
    }
    .groupSheetClose:active{
      transform:translateY(1px);
    }
    .groupSheetClose svg{
      width:16px;
      height:16px;
      stroke:currentColor;
      stroke-width:2.2;
      fill:none;
    }
    .groupCompareMetric{
      display:grid;
      gap:6px;
      padding:14px;
      border-radius:18px;
      background:linear-gradient(180deg, #fff 0%, #f8fafc 100%);
      box-shadow: inset 0 0 0 1px rgba(24,24,24,.05);
    }
    .groupCompareMetric span{
      font-size:11px;
      font-weight:800;
      letter-spacing:.06em;
      text-transform:uppercase;
      color:#6b6b6b;
    }
    .groupCompareMetric b{
      font-size:24px;
      line-height:1.05;
      letter-spacing:-.04em;
      color:#202020;
    }
    .groupCompareMetric small{
      font-size:12px;
      line-height:1.4;
      color:#666;
    }
    @media (max-width: 640px){
      .groupFocusCard{
        grid-template-columns:1fr;
        gap:18px;
        padding:18px;
      }
      .groupFocusMedia{
        max-width:280px;
      }
      .groupFocusPrice{
        font-size:42px;
      }
    }
    .groupRelatedSection{
      margin-bottom:16px;
    }
    .groupRelatedHead{
      display:flex;
      align-items:flex-start;
      justify-content:space-between;
      gap:12px;
      margin-bottom:12px;
    }
    .groupSheetFx .groupRelatedRail{
      padding:2px 2px 6px;
      gap:10px;
    }
    .groupSheetFx .groupRelatedRail > .dealCard.compactStatic{
      background:linear-gradient(180deg, rgba(255,255,255,.96) 0%, rgba(255,255,255,.9) 100%);
      border:1px solid rgba(255,98,0,.08);
      box-shadow:0 10px 24px rgba(20,20,20,.08);
    }
    .groupSheetFx .list{
      gap:8px;
    }
    .groupSheetFx .item{
      background:linear-gradient(180deg, rgba(244,246,249,.72) 0%, rgba(239,242,246,.58) 100%);
      border:1px solid rgba(148,163,184,.16);
      box-shadow: 0 8px 20px rgba(20,20,20,.05);
      padding:10px;
      border-radius:14px;
    }
    .groupSheetFx .item.noThumbItem{
      padding-top:54px;
    }
    .groupSheetFx .itemDiscountRibbon{
      top:-10px;
      right:12px;
      left:auto;
      padding:0 14px;
      font-size:17px;
      z-index:5;
    }
    .groupSheetFx .thumb{
      background:#f4f4f4;
      width:58px;
      height:58px;
      border-radius:12px;
      grid-column:1;
      grid-row:1;
    }
    .groupSheetFx .itemCopy{
      grid-column:2;
      grid-row:1;
      min-width:0;
    }
    .groupSheetFx .price{
      color:#F15A24;
      font-size:18px;
      font-weight:600;
    }
    .groupSheetFx .isub .tag{
      background:#f2f5f8;
      color:#5e6770;
      font-weight:500;
    }
    .groupSheetFx .itop{
      grid-template-columns:58px minmax(0,1fr) auto;
      gap:8px;
    }
    .groupSheetFx .itop.noThumb{
      grid-template-columns:minmax(0,1fr) auto;
    }
    .groupSheetFx .ititle{
      font-size:13px;
      line-height:1.2;
      font-weight:500;
      color:#4b5563;
    }
    .groupSheetFx .tiny{
      font-weight:500;
      color:#6b7280;
    }
    .groupSheetFx .isub{
      margin-top:4px;
      gap:6px;
    }
    .groupSheetFx .itemAside{
      grid-column:3;
      grid-row:1;
      min-width:0;
      gap:6px;
    }
    @media (max-width: 560px){
      .groupSheetFx .itop{
        grid-template-columns:minmax(0,1fr);
      }
      .groupSheetFx .itop.noThumb{
        grid-template-columns:minmax(0,1fr);
      }
      .groupSheetFx .thumb{
        grid-column:1 / -1;
        grid-row:1;
        width:100%;
        height:auto;
        min-height:210px;
      }
      .groupSheetFx .itemCopy{
        grid-column:1;
        grid-row:2;
      }
      .groupSheetFx .itop.noThumb .itemCopy{
        grid-row:1;
      }
      .groupSheetFx .itemAside{
        grid-column:1;
        grid-row:3;
        width:100%;
        grid-template-columns:minmax(0,1fr) auto;
        align-items:center;
        justify-items:stretch;
      }
      .groupSheetFx .item.noThumbItem{
        padding-top:50px;
      }
      .groupSheetFx .itop.noThumb .itemAside{
        grid-row:2;
      }
    }
    .groupSheetFx .iconBtns{
      gap:6px;
    }
    .groupSheetFx .iconBtn{
      width:34px;
      height:34px;
      border-radius:11px;
    }
    .groupSheetFx .iconBtn svg{
      width:17px;
      height:17px;
    }
    .groupSheetFx .miniAction{
      min-height:32px;
      padding:6px 10px;
      font-size:11px;
      gap:6px;
      color:#111111;
    }
    .groupSheetFx .miniAction.confirmVote,
    .groupSheetFx .miniAction.confirmVote.activeVote{
      color:#111111;
    }
    .groupSheetFx .miniActionGlyph{
      font-size:14px;
    }
    .groupSheetFx .proofThumb{
      margin-top:8px;
      width:72px;
      height:72px;
      border-radius:12px;
    }
    @keyframes storeOverlayFade{
      from{ opacity:0; }
      to{ opacity:1; }
    }
    @keyframes storeSheetUp{
      from{
        transform:translateY(26px) scale(.985);
        opacity:0;
      }
      to{
        transform:translateY(0) scale(1);
        opacity:1;
      }
    }

    .sheetHandle{
      width:54px; height:6px;
      border-radius:999px;
      background: rgba(15,23,32,.16);
      margin: 0 auto 10px;
    }

    /* --- Modern filter sheet --- */
    .filterSheetCard{
      background:#fbfcfe;
      border:1px solid rgba(15,23,42,.07);
      box-shadow:0 18px 44px rgba(15,23,42,.10);
      padding:28px 22px 122px;
    }
    .filterSheetHeader{
      align-items:center;
      margin-bottom:30px;
    }
    .filterSheetTitle{
      font-size:26px;
      line-height:1;
      font-weight:950;
      letter-spacing:0;
    }
    .filterCloseBtn{
      width:42px;
      height:42px;
      border:1px solid rgba(15,23,42,.08);
      border-radius:999px;
      background:#fff;
      color:#172033;
      display:grid;
      place-items:center;
      cursor:pointer;
      box-shadow:0 8px 18px rgba(15,23,42,.07);
    }
    .filterCloseBtn svg,
    .filterGeoActionIcon svg,
    .filterSearchIcon svg,
    .filterSheetActions .btn svg{
      width:18px;
      height:18px;
      fill:none;
      stroke:currentColor;
      stroke-width:2;
      stroke-linecap:round;
      stroke-linejoin:round;
    }
    .filterSummaryBlock{
      gap:14px;
      padding:0 0 16px;
    }
    .filterSummaryLabel{
      color:#8b95a7;
      font-size:11px;
      letter-spacing:.14em;
    }
    .filterSummaryEmpty{
      width:min(100%, 430px);
      min-height:70px;
      display:flex;
      align-items:center;
      gap:18px;
      padding:0 28px;
      border-radius:30px;
      background:#f8f4ff;
      border:1px solid rgba(81,21,181,.12);
      color:#5115B5;
      font-size:14px;
      font-weight:900;
      box-shadow:0 8px 18px rgba(81,21,181,.05);
    }
    .filterSummaryEmptyIcon,
    .filterSummaryEmptyCheck{
      width:20px;
      height:20px;
      display:grid;
      place-items:center;
      flex:0 0 auto;
    }
    .filterSummaryEmptyCheck{
      margin-left:auto;
    }
    .filterSummaryEmptyIcon svg,
    .filterSummaryEmptyCheck svg{
      width:20px;
      height:20px;
      fill:none;
      stroke:currentColor;
      stroke-width:2.4;
      stroke-linecap:round;
      stroke-linejoin:round;
    }
    .filterSection{
      border-top:none;
    }
    .filterSectionCard{
      margin-top:14px;
      padding:30px 30px;
      border-radius:26px;
      background:#fff;
      border:1px solid rgba(15,23,42,.07);
      box-shadow:0 14px 30px rgba(15,23,42,.055);
    }
    .filterLocationSection{
      gap:8px;
    }
    .filterEdgeTitle{
      font-size:20px;
      line-height:1.05;
      letter-spacing:0;
    }
    .filterHint{
      color:#6b7280;
      font-size:14px;
      line-height:1.35;
    }
    .filterSectionBody{
      gap:22px;
    }
    .filterLocationRow{
      gap:18px;
    }
    .filterGeoAction{
      min-height:100px;
      padding:20px 26px 20px 20px;
      border-radius:24px;
      background:#fbf9ff;
      border:1px solid rgba(15,23,42,.08);
      box-shadow:0 8px 18px rgba(15,23,42,.045);
      gap:24px;
    }
    .filterGeoAction.active{
      border-color:rgba(81,21,181,.34);
      background:#fbf9ff;
      box-shadow:0 12px 26px rgba(81,21,181,.09);
    }
    .filterGeoActionIcon{
      width:56px;
      height:56px;
      border-radius:14px;
      background:#f1e9ff;
      color:#5115B5;
    }
    .filterGeoActionIcon svg{
      width:24px;
      height:24px;
      stroke-width:2.4;
    }
    .filterGeoActionCopy{
      min-width:0;
      flex:1 1 auto;
      display:grid;
      gap:4px;
    }
    .filterGeoActionTitle{
      font-size:15px;
      line-height:1.15;
      font-weight:900;
      color:#172033;
    }
    .filterGeoActionSub{
      font-size:13px;
      line-height:1.35;
      font-weight:650;
      color:#7b8494;
    }
    .filterGeoRadio{
      width:28px;
      height:28px;
      border-radius:999px;
      border:4px solid rgba(148,163,184,.48);
      display:grid;
      place-items:center;
      flex:0 0 auto;
      background:#fff;
    }
    .filterGeoRadio span{
      width:12px;
      height:12px;
      border-radius:999px;
      background:#5115B5;
      transform:scale(0);
      transition:transform .16s ease;
    }
    .filterGeoAction.active .filterGeoRadio{
      border-color:#5115B5;
    }
    .filterGeoAction.active .filterGeoRadio span{
      transform:scale(1);
    }
    .filterOr{
      display:grid;
      grid-template-columns:minmax(0, 1fr) auto minmax(0, 1fr);
      align-items:center;
      gap:20px;
      color:#9aa4b2;
      font-size:11px;
      font-weight:900;
      letter-spacing:.14em;
    }
    .filterOr::before,
    .filterOr::after{
      content:"";
      height:1px;
      background:rgba(148,163,184,.28);
    }
    .filterSelectWrap{
      position:relative;
    }
    .filterSearchIcon{
      position:absolute;
      left:30px;
      top:39px;
      transform:translateY(-50%);
      color:#6b7280;
      pointer-events:none;
      z-index:2;
    }
    .filterSearchIcon svg{
      width:23px;
      height:23px;
      stroke-width:2.25;
    }
    .filterSelectField{
      min-height:78px;
      padding:0 22px 0 88px;
      border-radius:24px;
      border:1px solid rgba(15,23,42,.08);
      background:#fff;
      box-shadow:none;
      font-size:14px;
      font-weight:650;
    }
    .filterSelectField:focus{
      border-color:rgba(81,21,181,.26);
      box-shadow:0 0 0 4px rgba(81,21,181,.10);
    }
    .filterLocationHint{
      margin-top:-2px;
      font-size:13px;
    }
    .filterRangeValue{
      color:#5115B5;
      font-weight:900;
    }
    .filterRangeWrap{
      padding:26px 0 0;
      border-radius:0;
      background:transparent;
      box-shadow:none;
    }
    .filterRangeLegend{
      margin-top:24px;
      display:grid;
      grid-template-columns:1fr 1fr 1fr;
      align-items:center;
      color:#7b8494;
      font-size:13px;
      font-weight:800;
    }
    .filterRangeLegend span:nth-child(2){
      text-align:center;
    }
    .filterRangeLegend span:last-child{
      text-align:right;
    }
    .filterSheetActions{
      display:grid;
      grid-template-columns:minmax(0, 1fr) minmax(0, 1.18fr);
      gap:28px;
      padding:18px 22px calc(18px + env(safe-area-inset-bottom, 0px));
      background:rgba(251,252,254,.94);
    }
    .filterSheetActions .btn{
      min-width:0;
      width:100%;
      justify-content:center;
      gap:8px;
      font-weight:900;
      border-radius:18px;
      min-height:66px;
      font-size:14px;
    }
    .filterSheetActions .btn svg{
      width:20px;
      height:20px;
      stroke-width:2.35;
    }
    .filterSheetActions .btn.ghost,
    .filterResetBtn{
      border:1px solid rgba(81,21,181,.36) !important;
      background:#fff !important;
      color:#5115B5 !important;
      text-decoration:none;
      padding:0 12px !important;
    }
    .filterSheetActions .btn.primary,
    .filterApplyBtn{
      background:#5115B5 !important;
      color:#fff !important;
      box-shadow:0 12px 24px rgba(81,21,181,.22);
    }
    #citySuggest{
      border:1px solid rgba(15,23,42,.08);
      border-radius:18px;
      box-shadow:0 18px 36px rgba(15,23,42,.12);
    }
    #citySuggest .item{
      border-radius:14px;
    }
    @media (max-width:520px){
      .filterSheetCard{
        padding:16px 14px 104px;
      }
      .filterSectionCard{
        padding:16px;
      }
      .filterSheetActions{
        grid-template-columns:minmax(0, 1fr) minmax(0, 1.12fr);
      }
      .filterSheetActions .btn{
        min-height:48px;
        font-size:13px;
        padding:0 10px;
      }
    }

    /* --- City suggestions dropdown (floating) --- */
.cityWrap{
  position: relative;
}

#citySuggest{
  position: absolute;
  left: 0;
  right: 0;
  top: calc(100% + 8px);
  z-index: 9999;

  display: none;

  border-radius: 16px;
  overflow: auto;

  max-height: 240px;              /* wichtig: nicht riesig */
  background: rgba(255,255,255,.98);
  box-shadow: var(--shadow-lg);
  -webkit-overflow-scrolling: touch;
}

.filterSheetCard #citySuggest{
  border:1px solid rgba(15,23,42,.08);
  border-radius:18px;
  box-shadow:0 18px 36px rgba(15,23,42,.12);
}

.filterSummaryBlock{
  align-items:start;
}
.filterSummaryEmpty{
  height:48px;
  min-height:48px;
  max-height:48px;
  flex:0 0 auto;
  overflow:hidden;
}
.filterSheetCard .filterSummaryEmpty{
  width:min(100%, 430px);
}
.filterCloseBtn span{
  display:block;
  font-size:28px;
  line-height:1;
  font-weight:400;
  transform:translateY(-1px);
}

/* --- Deal cards (Signature Look) --- */
.dealList{ display:grid; gap:var(--space-3); }
.dealList.centered{
  justify-items:center;
}
.dealList.centered > .dealCard{
  width:224px;
}
.dealRail{
  display:flex;
  gap:12px;
  overflow-x:auto;
  overflow-y:hidden;
  padding:2px 2px 8px;
  scroll-snap-type:x mandatory;
  overscroll-behavior-x:contain;
  -webkit-overflow-scrolling:touch;
  touch-action:auto;
  scrollbar-width:none;
  -ms-overflow-style:none;
}
.dealRail::-webkit-scrollbar{ display:none; }
.dealRail > .dealCard{
  flex:0 0 auto;
  width:224px;
  scroll-snap-align:start;
  touch-action:auto;
}
.dealRail:has(.dealDiscountBadge){
  padding-top:12px;
}
@media (max-width: 640px){
  .dealList.centered > .dealCard,
  .dealRail > .dealCard,
  .dealCard.compactStatic{
    width:min(224px, calc(100vw - 36px));
    max-width:100%;
  }
  .dealRail{
    padding:2px 2px 8px;
  }
}
.dealCard{
  position:relative;
  isolation:isolate;
  display:flex;
  flex-direction:column;
  padding:0;
  overflow:hidden;
  border-radius:18px;
  background:
    rgba(255,255,255,.97);
  box-shadow: 0 10px 24px rgba(15,23,42,.06);
  color:var(--text);
  border:1px solid rgba(15,23,42,.07);
  backdrop-filter: blur(8px);
}
.dealCard:has(.dealDiscountBadge){
  overflow:visible;
}
.dealTopFlag{
  position:absolute;
  left:0;
  right:0;
  top:0;
  z-index:4;
  display:flex;
  align-items:center;
  min-height:28px;
  padding:6px 12px;
  background:linear-gradient(115deg, #9B5CF0 0%, #7C2FF2 45%, #5115B5 100%);
  color:#fff;
  font-size:11px;
  font-weight:900;
  letter-spacing:.04em;
  text-transform:uppercase;
  text-shadow:0 1px 2px rgba(45,10,110,.35);
  box-shadow:inset 0 -1px 0 rgba(255,255,255,.28), inset 0 1px 0 rgba(255,255,255,.4), 0 6px 18px rgba(124,47,242,.48);
}
.dealCard.item:hover{
  transform:none;
}

main[data-view="reports"] .card,
main[data-view="favorites"] .card,
main[data-view="mine"] .card{
  background:transparent;
  border:none;
  padding:0;
}
main[data-view="reports"] .dealCard,
main[data-view="favorites"] .dealCard,
main[data-view="mine"] .dealCard{
  background:rgba(255,255,255,.88);
  box-shadow: var(--shadow-md);
}
@media (min-width: 900px){
  main[data-view="reports"] .dealList,
  main[data-view="favorites"] .dealList,
  main[data-view="mine"] .dealList{
    grid-template-columns: repeat(auto-fit, 224px);
    justify-content:start;
  }
  main[data-view="reports"] .dealList.centered,
  main[data-view="favorites"] .dealList.centered,
  main[data-view="mine"] .dealList.centered{
    grid-template-columns: 224px;
    justify-content:center;
  }
}
.dealMedia{
  position:relative;
  height:128px;
  background:
    linear-gradient(160deg, #ffffff 0%, #f5f7fa 100%);
}
.dealCard.compactStatic{
  max-width:224px;
  cursor:default;
}
.dealCard.compactStatic .dealMedia{
  height:132px;
}
.dealMedia img{
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
  display:block;
  padding:8px;
  mix-blend-mode:normal;
  opacity:1;
}
.dealFallback{
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#ffffff;
}
.dealSticker{
  position:absolute;
  left:9px;
  top:9px;
  z-index:3;
  background:#fff;
  color:var(--brand);
  font-size:10px;
  font-weight:800;
  letter-spacing:.03em;
  text-transform:uppercase;
  padding:5px 8px;
  border-radius:10px;
  transform:none;
  box-shadow:0 6px 14px rgba(15,23,42,.08);
}
    .dealSticker.discount{
      background:linear-gradient(180deg, #F06B18 0%, #D85A0B 100%);
      color:#ffffff;
      font-size:11px;
      padding:6px 10px;
      border-radius:8px;
      transform:none;
      left:8px;
      top:8px;
      border:1px solid rgba(255,255,255,.18);
      box-shadow:0 8px 18px rgba(216,11,25,.22);
    }
.dealCard:has(.dealTopFlag) .dealSticker{
  top:44px;
}
.dealCard:has(.dealTopFlag) .dealBody{
  padding-top:44px;
}
.dealSticker.discount::after{
  display:none;
}
.dealBadgeRow{
  position:absolute;
  left:8px;
  right:8px;
  bottom:8px;
  display:flex;
  gap:5px;
  align-items:center;
  z-index:2;
}
.dealBadge{
  font-size:9px;
  font-weight:700;
  padding:4px 7px;
  border-radius:999px;
  color:var(--muted);
  background: rgba(255,255,255,.94);
  box-shadow:0 5px 12px rgba(15,23,42,.055);
}
.dealPrice{
  margin-left:auto;
  font-size:13px;
  background:rgba(241,90,36,.10);
  color:#F15A24;
}
.dealBody{
  display:flex;
  flex:1 1 auto;
  flex-direction:column;
  padding:11px;
}
.dealCard.compactStatic .dealBody{
  padding:9px;
}
.dealPromo{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:8px;
  flex-wrap:wrap;
}
.dealPromoPercent{
  font-size:10px;
  line-height:1;
  font-weight:900;
  color:var(--discount-ink);
  background:var(--discount-soft);
  border-radius:999px;
  padding:5px 9px;
  letter-spacing:-.03em;
  border:1px solid var(--discount-border);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.65);
}
.dealPromoTextOnly{
  font-size:10px;
  line-height:1.35;
  font-weight:var(--fw-meta);
  color:var(--fc-meta);
}
.dealPromoText{
  font-size:10px;
  color:var(--muted);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.dealTopRow{
  display:flex;
  gap:8px;
  align-items:flex-start;
  margin-top:5px;
}
.dealTitle{
  flex:1;
  min-width:0;
  font-size:var(--fs-title);
  font-weight:var(--fw-title);
  line-height:1.25;
  color:var(--fc-title);
}
.dealCard.compactStatic .dealTitle{
  font-size:12px;
}
.dealCommentBadge{
  display:inline-flex;
  align-items:center;
  gap:6px;
  align-self:flex-start;
  max-width:100%;
  min-height:22px;
  margin-top:7px;
  padding:0;
  border-radius:0;
  background:transparent;
  color:#4b5563;
  border:0;
  font-size:11px;
  font-weight:750;
  line-height:1.2;
}
.dealCommentIcon{
  flex:0 0 auto;
  display:inline-grid;
  place-items:center;
  width:18px;
  height:18px;
  border-radius:10px;
  background:rgba(255,98,0,.08);
  color:var(--primary);
}
.dealCommentIcon svg{
  width:12px;
  height:12px;
  fill:none;
  stroke:currentColor;
  stroke-width:2.4;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.dealCommentText{
  min-width:0;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.dealCard.compactStatic .dealCommentBadge{
  margin-top:5px;
  font-size:10px;
}
.dealCard.compactStatic .dealCommentIcon{
  width:16px;
  height:16px;
}
.dealCard.compactStatic .dealCommentIcon svg{
  width:10px;
  height:10px;
}
.dealCount{
  font-size:10px;
  font-weight:800;
  padding:0;
  color:#6b7280;
  background:transparent;
  border:none;
  white-space:nowrap;
}
.dealMeta{
  margin-top:6px;
  display:flex;
  gap:6px;
  flex-wrap:wrap;
}
.dealMeta .tag{
  background:rgba(248,250,252,.96);
  color:#667180;
  padding:5px 9px;
  border-radius:999px;
  box-shadow: inset 0 0 0 1px rgba(148,163,184,.18);
}
.dealInsightRow{
  margin-top:0;
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}
.trustBadge,
.dealInsight,
.itemCompareTag{
  display:inline-flex;
  align-items:center;
  min-height:22px;
  padding:4px 9px;
  border-radius:999px;
  font-size:10px;
  font-weight:800;
  letter-spacing:.01em;
  background:rgba(248,250,252,.9);
  box-shadow: inset 0 0 0 1px rgba(148,163,184,.16);
}
.trustBadge{
  color:#52606d;
}
.trustBadge.good,
.dealInsight.good,
.itemCompareTag.good{
  color:#15803d;
}
.trustBadge.warn,
.dealInsight.warn,
.itemCompareTag.warn{
  color:#52606d;
}
.trustBadge.bad,
.dealInsight.bad,
.itemCompareTag.bad{
  color:#F15A24;
}
.trustBadge.neutral,
.dealInsight.neutral,
.itemCompareTag.neutral{
  color:#5b6673;
}
.dealStore{
  margin-top:auto;
  padding-top:8px;
  font-size:10px;
  color:var(--muted);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:normal;
}
.dealAction{
  margin-top:8px;
  padding-top:9px;
  border-top:1px solid rgba(15,23,42,.055);
  display:flex;
  justify-content:flex-start;
  align-items:center;
  gap:6px;
  flex-wrap:nowrap;
}
.dealCard.compactStatic .dealAction{
  display:none;
}
.dealAction .miniAction{
  flex:1 1 0;
  justify-content:center;
  min-width:0;
}
.dealActionIcons{
  display:flex;
  align-items:center;
  gap:4px;
  margin-left:auto;
  flex:0 0 auto;
}
.ownSimpleCard{
  min-height:0;
  background:linear-gradient(180deg, rgba(255,255,255,.98) 0%, rgba(247,248,249,.96) 100%) !important;
  border:1px solid rgba(15,23,42,.06);
  box-shadow:0 12px 28px rgba(15,23,42,.06) !important;
}
.ownSimpleBody{
  padding:12px 12px 12px;
}
.ownSimpleTopRow{
  margin-top:0;
  margin-bottom:8px;
}
.ownSimplePriceBlock{
  margin-top:0;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:3px;
}
.ownSimpleCard .dealPreviousLine{
  margin-top:2px;
}
.ownSimpleCard .dealWas{
  display:block;
}
.ownSimpleMeta{
  margin-top:8px;
}
.ownSimpleStore{
  margin-top:8px;
}
.ownSimpleCard .dealMedia{
  height:132px;
  background:linear-gradient(180deg, #fbfbfb 0%, #f2f4f6 100%);
  border-bottom:1px solid rgba(15,23,42,.05);
}
.ownSimpleCard .dealMedia img{
  padding:8px;
}
.ownSimpleCard .dealTitle{
  font-size:14px;
  font-weight:800;
  line-height:1.18;
  color:#18212a;
}
.ownSimpleCard .dealNow{
  color:#F15A24;
  font-size:24px;
  line-height:.96;
}
.ownSimpleCard .dealWas{
  color:#9aa4af;
  font-size:12px;
}
.ownSimpleCard .dealMeta .tag{
  background:#f3f5f7;
  color:#66707c;
  box-shadow:none;
  border:1px solid rgba(148,163,184,.16);
}
.ownSimpleCategoryTag{
  font-weight:700;
}
.ownSimpleReduction{
  position:absolute;
  left:10px;
  top:10px;
  z-index:3;
  display:inline-flex;
  align-items:center;
  min-height:22px;
  padding:3px 7px;
  border-radius:999px;
  background:rgba(255,255,255,.92);
  color:#5f6b76;
  font-family:var(--font-display);
  font-size:10px;
  font-weight:700;
  letter-spacing:.01em;
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 8px 18px rgba(15,23,42,.06);
}
.ownSimpleStoreText{
  display:block;
  font-size:12px;
  line-height:1.4;
  color:#6a7480;
}
.ownSimpleActions{
  margin-top:10px;
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}
.ownSimpleActionBtn{
  min-height:32px;
  padding:6px 10px;
  border-radius:10px;
  background:#f5f7f8;
  color:#52606d;
  border:1px solid rgba(15,23,42,.08);
  font-size:10px;
  font-weight:700;
}
.ownSimpleActionBtn:hover{
  background:#eef2f4;
}
.ownSimpleActionBtn.danger{
  background:#fbf3f4;
  color:#a24d56;
  border-color:rgba(162,77,86,.14);
}
main[data-view="mine"] .dealCard{
  background:rgba(255,255,255,.94);
  box-shadow:0 12px 28px rgba(15,23,42,.06);
}
main[data-view="mine"] .dealSticker,
main[data-view="mine"] .dealBadgeRow{
  display:none;
}
main[data-view="mine"] .dealMeta{
  gap:8px;
}
main[data-view="mine"] .dealMeta .tag{
  background:#f3f5f7;
  color:#66707c;
  border:1px solid rgba(148,163,184,.16);
  box-shadow:none;
}
main[data-view="mine"] .dealStore .storeBadge,
main[data-view="mine"] .dealStore .storeBadgeMark{
  background:none;
  box-shadow:none;
  border:none;
}
.dealUtilityRow{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin-top:8px;
}
.dealCollectionMeta{
  display:flex;
  align-items:center;
  gap:6px;
  flex-wrap:wrap;
}
.dealCategoryTag,
.dealFavoriteBadge,
.dealPlannerTag{
  display:inline-flex;
  align-items:center;
  min-height:24px;
  padding:4px 9px;
  border-radius:999px;
  font-size:11px;
  font-weight:800;
  letter-spacing:.01em;
  box-shadow: inset 0 0 0 1px rgba(148,163,184,.16);
}
.dealCategoryTag{
  color:var(--accent-strong);
}
.dealCategoryTag.tone-food,
.tag.tone-food{
  color:#2563eb;
  background:rgba(37,99,235,.10);
  border-color:rgba(37,99,235,.18);
  box-shadow: inset 0 0 0 1px rgba(37,99,235,.18);
}
.dealCategoryTag.tone-drinks,
.tag.tone-drinks{
  color:#0f766e;
  background:rgba(15,118,110,.10);
  border-color:rgba(15,118,110,.18);
  box-shadow: inset 0 0 0 1px rgba(15,118,110,.18);
}
.dealCategoryTag.tone-beauty,
.tag.tone-beauty{
  color:#db2777;
  background:rgba(219,39,119,.10);
  border-color:rgba(219,39,119,.18);
  box-shadow: inset 0 0 0 1px rgba(219,39,119,.18);
}
.dealCategoryTag.tone-home,
.tag.tone-home{
  color:#0f766e;
  background:rgba(15,118,110,.10);
  border-color:rgba(15,118,110,.18);
  box-shadow: inset 0 0 0 1px rgba(15,118,110,.18);
}
.dealCategoryTag.tone-tech,
.tag.tone-tech{
  color:#4f46e5;
  background:rgba(79,70,229,.10);
  border-color:rgba(79,70,229,.18);
  box-shadow: inset 0 0 0 1px rgba(79,70,229,.18);
}
.dealCategoryTag.tone-style,
.tag.tone-style{
  color:#9333ea;
  background:rgba(147,51,234,.10);
  border-color:rgba(147,51,234,.18);
  box-shadow: inset 0 0 0 1px rgba(147,51,234,.18);
}
.dealCategoryTag.tone-other,
.tag.tone-other{
  color:#64748b;
  background:rgba(148,163,184,.10);
  border-color:rgba(148,163,184,.18);
  box-shadow: inset 0 0 0 1px rgba(148,163,184,.16);
}
.dealFavoriteBadge{
  color:var(--primary);
}
.dealPlannerTag{
  color:var(--good);
}
.dealConfirmBtn{
  color:#111111;
}
.dealConfirmBtn.active,
.dealConfirmBtn.confirmVote.activeVote{
  color:#15803d;
}
.iconBtnLocation img{
  width:18px;
  height:18px;
  display:block;
  object-fit:contain;
}
.dealCta{
  font-size:10px;
  font-weight:700;
  color:#fff;
  background:var(--brand);
  border-radius:999px;
  padding:5px 9px;
  box-shadow: var(--shadow-sm);
}
.storeSheetFx .dealRail > .dealCard.compactStatic{
  width:236px;
}
.storeSheetFx .dealList{
  justify-items:start;
}
.storeSheetFx .dealList > .dealCard.compactStatic{
  width:min(100%, 236px);
}
.storeSheetFx .dealCard.compactStatic{
  max-width:none;
}
.storeSheetFx .dealCard.compactStatic .dealMedia{
  height:152px;
}
.storeSheetFx .dealCard.compactStatic .dealBody{
  padding:10px;
}
  .dealPriceBlock{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:2px;
    margin-top:8px;
  }
  .dealDiscountBadge{
    position:absolute;
    top:-10px;
    right:12px;
    z-index:5;
    display:flex;
    align-items:center;
    justify-content:center;
    min-width:72px;
    height:42px;
    padding:0 14px;
    clip-path:polygon(7% 4%, 94% 0%, 100% 91%, 10% 100%);
    background:linear-gradient(135deg, #D64B3E 0%, #B7352B 100%);
    color:#ffffff;
    font-family:var(--font-display);
    font-size:17px;
    font-weight:800;
    line-height:1;
    letter-spacing:0;
    border:0;
    box-shadow:0 7px 16px rgba(0,0,0,.16);
  }
  .dealNow{
    font-size:24px;
    line-height:.9;
    letter-spacing:-.04em;
    font-weight:var(--fw-title);
    color:#F15A24;
  }
  .dealWas{
    display:inline-block;
    font-size:13px;
    color:#8b95a1;
    text-decoration:line-through;
    line-height:1.1;
  }
  .dealPreviousLine{
    margin-top:0;
    order:1;
  }
.storeBadge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-width:0;
}
.storeBadgeMark{
      width:22px;
      height:22px;
  border-radius:9px;
  display:grid;
  place-items:center;
  background:rgba(241,245,249,.96);
  color:#475569;
  font-size:11px;
  font-weight:800;
  flex:0 0 auto;
}
  .sectionTitle{
  display:inline-flex;
  align-items:center;
  font-weight:var(--fw-headline);
  font-size:var(--fs-headline);
  color:var(--fc-headline);
  letter-spacing:-.02em;
  }
  .reportSection{
    padding:16px 14px 14px;
    border-radius:24px;
    background:
      rgba(255,255,255,.96);
    border:1px solid rgba(15,23,42,.07);
    box-shadow:0 12px 26px rgba(15,23,42,.055);
  }
  .reportSection .sectionTitle{
    color:var(--fc-headline);
  }
  .reportSection .hr{
    margin:12px 0;
  }
  .reportSection .hint{
    color:var(--fc-meta);
    font-size:12px;
    line-height:1.45;
  }
  .categoryBannerSection{
    position:relative;
    width:100vw;
    margin-left:calc(50% - 50vw);
    margin-right:calc(50% - 50vw);
    margin-bottom:10px;
  }
  .categoryBannerBar{
    position:relative;
    min-height:188px;
    width:100%;
    border-radius:0;
    overflow:hidden;
    margin-bottom:0;
    padding:20px 20px 72px;
    display:flex;
    align-items:flex-start;
    justify-content:center;
    background-position:center;
    background-repeat:no-repeat;
    background-size:cover;
    isolation:isolate;
  }
  .categoryBannerBar::after{
    content:"";
    position:absolute;
    inset:0;
    background:
      linear-gradient(180deg, rgba(7,34,41,.12) 0%, rgba(7,34,41,.34) 42%, rgba(255,255,255,0) 72%, rgba(255,255,255,.96) 100%);
    z-index:0;
  }
  .categoryBannerBar > div{
    position:relative;
    z-index:1;
    width:min(100%, calc(var(--content-max) + clamp(32px, 6vw, 56px)));
    padding:0 clamp(16px, 3vw, 28px);
  }
  .categoryBannerBar strong{
    display:block;
    font-size:clamp(28px, 4vw, 42px);
    line-height:.96;
    letter-spacing:-.03em;
    color:#fff;
    font-weight:900;
    max-width:10ch;
    text-shadow:0 12px 28px rgba(8,8,10,.22);
  }
  .categoryBannerBar span{
    display:block;
    margin-top:10px;
    max-width:34ch;
    font-size:14px;
    line-height:1.45;
    color:rgba(255,255,255,.92);
    text-shadow:0 10px 24px rgba(8,8,10,.20);
  }
  .categoryBannerOverlay{
    position:relative;
    z-index:2;
    margin-top:-68px;
    padding:0 clamp(16px, 3vw, 28px);
    width:min(100%, calc(var(--content-max) + clamp(32px, 6vw, 56px)));
    margin-left:auto;
    margin-right:auto;
    pointer-events:auto;
  }
  .categoryBannerSection.is-empty .categoryBannerOverlay{
    margin-top:0;
    padding-top:12px;
    min-height:0;
  }
  .categoryBannerOverlay > .dealRail{
    padding:2px 2px 10px;
  }
  .categoryBannerOverlay > .dealCard,
  .categoryBannerOverlay .dealCard{
    background:#ffffff;
    box-shadow:0 16px 28px rgba(17,24,39,.12);
    backdrop-filter:none;
  }
  .reportSectionCompactCards .categoryBannerOverlay > .dealRail{
    gap:9px;
  }
  .reportSectionCompactCards .categoryBannerOverlay .dealRail > .dealCard,
  .reportSectionCompactCards .categoryBannerOverlay .dealList.centered > .dealCard{
    width:224px;
  }
  .reportSectionCompactCards .categoryBannerOverlay .dealList.centered.homeProductList{
    justify-items:stretch;
  }
  .reportSectionCompactCards .categoryBannerOverlay .dealList.centered.homeProductList > .dealCard{
    width:100%;
    max-width:100%;
  }
  .reportSectionCompactCards .categoryBannerOverlay .dealCard{
    border-radius:18px;
  }
  .reportSectionCompactCards .categoryBannerOverlay .dealMedia{
    height:132px;
  }
  .reportSectionCompactCards .categoryBannerOverlay .dealBody{
    padding:7px;
  }
  .reportSectionCompactCards .categoryBannerOverlay .dealTitle{
    font-size:12px;
    line-height:1.1;
  }
  .reportSectionCompactCards .categoryBannerOverlay .dealMeta{
    margin-top:4px;
    gap:4px;
  }
  .reportSectionCompactCards .categoryBannerOverlay .dealInsightRow{
    margin-top:0;
    gap:4px;
  }
  .reportSectionCompactCards .categoryBannerOverlay .dealStore{
    padding-top:4px;
    font-size:9px;
  }
  .reportSectionCompactCards .categoryBannerOverlay .dealStore .dealInsightRow{
    margin-bottom:5px;
  }
  .reportSectionCompactCards .categoryBannerOverlay .dealPriceBlock{
    gap:2px;
    margin-top:7px;
  }
  .reportSectionCompactCards .categoryBannerOverlay .dealDiscountBadge{
    min-width:72px;
    height:42px;
    padding:0 14px;
    font-size:17px;
  }
  .reportSectionCompactCards .categoryBannerOverlay .dealNow{
    font-size:22px;
  }
  .reportSectionCompactCards .categoryBannerOverlay .dealWas{
    font-size:12px;
  }
  .reportSectionCompactCards .categoryBannerOverlay .dealAction{
    margin-top:5px;
    padding-top:5px;
  }
  .categoryBannerBar[data-banner-cat="food"],
  .categoryBannerBar[data-cat="Lebensmittel"]{
    background-image:url("/lebensmittel.jpg");
  }
  .categoryBannerBar[data-banner-cat="drinks"],
  .categoryBannerBar[data-cat="Getränke"]{
    background-image:url("/plastik.jpg");
  }
  .categoryBannerBar[data-banner-cat="drugstore"],
  .categoryBannerBar[data-cat="Drogerie"]{
    background-image:url("/drogerie.jpg");
  }
  .categoryBannerBar[data-banner-cat="household"],
  .categoryBannerBar[data-cat="Haushalt"]{
    background-image:url("/hygiene.jpg");
  }
  .categoryBannerBar[data-banner-cat="pets"],
  .categoryBannerBar[data-cat="Tierprodukte"]{
    background-image:url("/hundkatz.jpg");
  }
  @media (max-width: 760px){
    .categoryBannerBar{
      min-height:170px;
      padding:18px 0 68px;
    }
    .categoryBannerBar > div{
      padding:0 14px;
    }
    .categoryBannerBar strong{
      font-size:clamp(24px, 7.2vw, 32px);
      max-width:11ch;
    }
    .categoryBannerBar span{
      font-size:13px;
      max-width:28ch;
    }
    .categoryBannerOverlay{
      margin-top:-58px;
      padding:0 12px;
    }
    .reportSectionCompactCards .categoryBannerOverlay .dealRail > .dealCard,
    .reportSectionCompactCards .categoryBannerOverlay .dealList.centered > .dealCard{
      width:min(224px, calc(100vw - 36px));
    }
    .reportSectionCompactCards .categoryBannerOverlay .dealMedia{
      height:132px;
    }
    .categoryBannerSection.is-empty .categoryBannerOverlay{
      margin-top:0;
      padding-top:10px;
    }
  }
  @media (max-width: 480px){
    .categoryBannerBar{
      min-height:156px;
      padding:16px 0 62px;
    }
    .categoryBannerOverlay{
      margin-top:-52px;
      padding:0 10px;
    }
    .reportSectionCompactCards .categoryBannerOverlay .dealRail > .dealCard,
    .reportSectionCompactCards .categoryBannerOverlay .dealList.centered > .dealCard{
      width:min(224px, calc(100vw - 36px));
    }
    .reportSectionCompactCards .categoryBannerOverlay .dealMedia{
      height:132px;
    }
    .categoryBannerSection.is-empty .categoryBannerOverlay{
      margin-top:0;
  padding-top:9px;
  border-top:1px solid rgba(15,23,42,.055);
    }
  }
  @media (max-width: 640px){
    .reportSectionCompactCards .categoryBannerSection{
      width:calc(100% + 24px);
      max-width:calc(100% + 24px);
      margin-left:-12px;
      margin-right:-12px;
    }
    .reportSectionCompactCards .categoryBannerBar{
      border-radius:18px 18px 0 0;
      overflow:hidden;
    }
    .reportSectionCompactCards .categoryBannerBar > div,
    .reportSectionCompactCards .categoryBannerOverlay{
      width:100%;
      max-width:100%;
    }
  }
  .sectionBlock{
    padding:8px 0 0;
    border-radius:0;
    background:transparent;
    border:none;
    box-shadow:none;
  }
  .collapsibleSection{
    padding:0;
  }
  .collapsibleSection summary{
    list-style:none;
    cursor:pointer;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    min-height:52px;
    padding:0 2px;
    border-top:1px solid rgba(15,23,42,.07);
    border-bottom:1px solid rgba(15,23,42,.07);
  }
  .collapsibleSection summary::-webkit-details-marker{
    display:none;
  }
  .collapsibleSection summary::after{
    content:"›";
    flex:0 0 auto;
    color:#8a94a3;
    font-size:22px;
    font-weight:800;
    line-height:1;
    transform:rotate(90deg);
    transition:transform .18s ease;
  }
  .collapsibleSection[open] summary::after{
    transform:rotate(-90deg);
  }
  .collapsibleSectionTitle{
    color:var(--fc-headline);
    font-size:var(--fs-headline);
    font-weight:var(--fw-headline);
    letter-spacing:-.02em;
  }
  .collapsibleSectionHint{
    margin-left:auto;
    color:var(--fc-meta);
    font-size:var(--fs-meta);
    font-weight:var(--fw-meta);
    white-space:nowrap;
  }
  .collapsibleSectionBody{
    padding-top:12px;
  }
  .legalNote{
    margin-top:16px;
    padding:16px;
    background:#fff;
    border:1px solid rgba(15,23,32,.06);
    border-radius:16px;
    color:var(--muted);
    font-size:12px;
    line-height:1.55;
  }
  .legalNote summary{
    cursor:pointer;
    font-weight:800;
    color:#343434;
    list-style:none;
  }
  .legalNote summary::-webkit-details-marker{
    display:none;
  }
  .legalNote summary::after{
    content:"›";
    float:right;
    color:var(--muted2);
    transform:rotate(90deg);
    transition:transform .18s ease;
  }
  .legalNote[open] summary::after{
    transform:rotate(-90deg);
  }
  .legalNote p{
    margin:12px 0 0;
  }
  .legalNote p + p{
    margin-top:12px;
  }

.savingsRankCard{
  display:grid;
  gap:16px;
  padding:20px;
  border-radius:28px;
  background:#ffffff;
  border:1px solid rgba(18,24,32,.04);
  box-shadow:0 14px 34px rgba(18,24,32,.06);
  overflow:hidden;
}
.savingsRankSection{
  margin-top:16px;
}
.savingsRankTop{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
}
.savingsRankHero{
  min-width:0;
  display:block;
  flex:1 1 auto;
}
.savingsRankLabel{
  display:block;
  font-size:11px;
  font-weight:900;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:#9aa4b2;
  margin-bottom:10px;
}
.savingsRankHeroAmount{
  font-size:clamp(36px, 7.5vw, 52px);
  line-height:.92;
  letter-spacing:-.05em;
  font-weight:1000;
  color:#0f172a;
}
.savingsRankTierPill{
  flex:0 0 auto;
  align-self:center;
  font-family:var(--font-display);
  font-size:12px;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:#B45418;
  background:#FFF1E6;
  padding:10px 14px;
  border-radius:999px;
  border:1px solid rgba(180,84,24,.10);
  box-shadow:0 8px 18px rgba(180,84,24,.06);
}
.savingsRankMetaText{
  display:flex;
  flex-wrap:wrap;
  gap:8px 18px;
  font-size:13px;
  color:#667085;
  font-weight:700;
}
.savingsRankMetaText strong{
  color:#111827;
  font-weight:900;
}
.savingsRankProgressHeader{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  font-size:12px;
}
.savingsRankProgressHeader strong{
  color:#111827;
  font-size:14px;
  font-weight:900;
}
.savingsRankProgressHeader span{
  color:#7a8698;
  font-weight:800;
  text-align:right;
}
.savingsRankRailCompact{
  position:relative;
  display:grid;
  align-items:center;
  min-height:18px;
}
.savingsRankLine,
.savingsRankFill{
  grid-column:1;
  grid-row:1;
  align-self:center;
  height:12px;
  border-radius:999px;
}
.savingsRankLine{
  background:#eef2f7;
  box-shadow:inset 0 0 0 1px rgba(17,24,39,.04);
}
.savingsRankFill{
  width:0;
  background:#FF6200;
  box-shadow:none;
}
.savingsRankMarkers{
  position:relative;
  display:grid;
  grid-template-columns:repeat(6, minmax(0, 1fr));
  align-items:center;
  height:18px;
  margin-top:-2px;
}
.savingsRankStop{
  position:relative;
  justify-self:center;
  width:10px;
  height:10px;
  border-radius:999px;
  background:#fff;
  border:2px solid #d7deea;
  box-shadow:none;
}
.savingsRankStop.active{
  border-color:#FF6200;
  background:#FFF1E6;
}
.savingsRankStop.current{
  width:14px;
  height:14px;
  border-color:#fff;
  background:#FF6200;
  box-shadow:0 0 0 3px rgba(255,90,95,.10);
}
.savingsRankStop.start{
  justify-self:start;
}
.savingsRankStop.end{
  justify-self:end;
}
.savingsRankScaleCompact{
  display:grid;
  grid-template-columns:repeat(6, minmax(0, 1fr));
  gap:6px;
  font-size:11px;
  font-weight:800;
  color:#98a2b3;
}
.savingsRankScaleCompact span{
  text-align:center;
}
.savingsRankScaleCompact span:first-child{
  text-align:left;
}
.savingsRankScaleCompact span:last-child{
  text-align:right;
}
.savingsRankScaleCompact .current{
  color:#FF6200;
}
@media (max-width: 560px){
  .savingsRankCard{
    padding:16px;
    gap:12px;
  }
  .savingsRankHero{
    display:block;
  }
  .savingsRankHeroAmount{
    font-size:34px;
  }
  .savingsRankProgressHeader{
    align-items:flex-start;
    flex-direction:column;
    gap:4px;
  }
  .savingsRankProgressHeader span{
    text-align:left;
  }
  .savingsRankMarkers{
    height:16px;
  }
  .savingsRankStop{
    width:9px;
    height:9px;
  }
  .savingsRankStop.current{
    width:12px;
    height:12px;
  }
}

  .homeFocusPanel{
    display:grid;
    gap:20px;
  }
  .homeFocusShell{
    display:grid;
    gap:20px;
  }
  .homeFocusTopBar{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    padding:0 10px;
  }
  .homeFocusLocationBtn{
    display:inline-flex;
    align-items:center;
    gap:10px;
    min-height:56px;
    padding:12px 20px;
    border:none;
    border-radius:999px;
    background:linear-gradient(180deg, #FF9A45 0%, #FF6200 100%);
    color:#fff;
    font-size:16px;
    font-weight:800;
    box-shadow:0 14px 26px rgba(170, 12, 24, .18);
    white-space:nowrap;
  }
  .homeFocusLocationCaret{
    width:14px;
    height:14px;
    opacity:.95;
  }
  .homeFocusLocationIcon,
  .homeFocusTopIcon,
  .homeFocusScanIcon,
  .homeFocusInstallBtnIcon,
  .homeFocusLocationCaret{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    line-height:0;
  }
  .homeFocusLocationIcon svg,
  .homeFocusTopIcon svg,
  .homeFocusScanIcon svg,
  .homeFocusInstallBtnIcon svg,
  .homeFocusLocationCaret svg{
    width:20px;
    height:20px;
    stroke:currentColor;
    fill:none;
    stroke-width:2;
    stroke-linecap:round;
    stroke-linejoin:round;
  }
  .homeFocusTopActions{
    display:grid;
    grid-template-columns:repeat(2, 52px);
    border-radius:20px;
    padding:2px;
    background:linear-gradient(180deg, rgba(255,255,255,.98) 0%, rgba(246,246,246,.94) 100%);
    box-shadow:var(--shadow-sm), inset 0 0 0 1px rgba(24,24,24,.08);
    overflow:hidden;
  }
  .homeFocusTopIcon{
    width:52px;
    height:52px;
    border:none;
    border-radius:0;
    background:transparent;
    color:#677281;
  }
  .homeFocusTopIcon + .homeFocusTopIcon{
    border-left:1px solid rgba(24,24,24,.10);
  }
  .homeFocusHeroCard{
    position:relative;
    overflow:hidden;
    display:grid;
    gap:0;
    border-radius:0;
    background:transparent;
    box-shadow:none;
  }
  .homeFocusHeroBanner{
    position:relative;
    overflow:hidden;
    min-height:210px;
    padding:36px 30px 104px;
    border-radius:0 0 34px 34px;
    background:
      radial-gradient(120% 120% at 100% 0%, rgba(255,255,255,.12), transparent 40%),
      linear-gradient(160deg, #E6732B 0%, #FF873C 55%, #FF9B5D 100%);
    color:#fff;
    box-shadow:0 24px 40px rgba(20,20,20,.10);
  }
  .homeFocusHeroBanner::after{
    content:"";
    position:absolute;
    left:-6%;
    right:-6%;
    bottom:-46px;
    height:100px;
    background:linear-gradient(180deg, rgba(255,255,255,.98) 0%, rgba(255,255,255,.98) 100%);
    border-radius:50% 50% 0 0 / 100% 100% 0 0;
    transform:rotate(-4deg);
  }
  .homeFocusHeroBannerInner{
    position:relative;
    z-index:1;
    display:grid;
    gap:12px;
    max-width:34rem;
    padding-right:220px;
  }
  .homeFocusHeroBannerInner strong{
    font-size:clamp(42px, 7vw, 72px);
    line-height:.92;
    letter-spacing:-.05em;
    font-weight:900;
    color:#fff;
    text-shadow:0 2px 0 rgba(176, 14, 24, .12);
  }
  .homeFocusHeroBannerInner p{
    margin:0;
    font-size:18px;
    line-height:1.35;
    color:rgba(255,255,255,.95);
  }
  .homeFocusBody{
    position:relative;
    display:grid;
    grid-template-columns:minmax(0, 1fr) minmax(180px, 270px);
    align-items:end;
    gap:12px;
    margin-top:-92px;
    padding:0 22px 30px;
  }
  .homeFocusScanCopy{
    display:grid;
    gap:12px;
    padding:96px 0 112px 10px;
  }
  .homeFocusScanCopy h3{
    margin:0;
    font-size:clamp(28px, 5vw, 44px);
    line-height:1.02;
    letter-spacing:-.04em;
    color:#303846;
    font-weight:900;
  }
  .homeFocusScanCopy p{
    margin:0;
    max-width:14rem;
    font-size:17px;
    line-height:1.42;
    color:#5c6776;
  }
  .homeFocusHeroVisual{
    position:relative;
    min-height:402px;
    display:flex;
    align-items:flex-end;
    justify-content:flex-end;
  }
  .homeFocusHand{
    position:absolute;
    right:-24px;
    bottom:-6px;
    width:186px;
    height:270px;
    border-radius:90px 90px 24px 24px;
    background:
      radial-gradient(circle at 40% 24%, rgba(255,226,214,.92) 0 18%, transparent 19%),
      radial-gradient(circle at 54% 34%, rgba(255,220,205,.94) 0 20%, transparent 21%),
      radial-gradient(circle at 64% 46%, rgba(255,211,194,.96) 0 18%, transparent 19%),
      linear-gradient(180deg, #ffd8c8 0%, #f7b79c 72%, rgba(247,183,156,.08) 100%);
    filter:blur(.2px);
    box-shadow:-14px 18px 34px rgba(214,149,120,.26);
    opacity:.95;
  }
  .homeFocusPhoneMock{
    position:relative;
    z-index:1;
    width:min(100%, 246px);
    height:420px;
    padding:8px;
    border-radius:36px;
    background:
      linear-gradient(180deg, #4c4e57 0%, #17181e 20%, #090a0f 100%);
    box-shadow:0 26px 44px rgba(20,20,20,.28), inset 0 0 0 2px rgba(255,255,255,.08);
  }
  .homeFocusPhoneNotch{
    position:absolute;
    left:50%;
    top:10px;
    transform:translateX(-50%);
    width:84px;
    height:16px;
    border-radius:0 0 12px 12px;
    background:#17181d;
    z-index:3;
  }
  .homeFocusPhoneScreen{
    position:relative;
    height:100%;
    border-radius:28px;
    background:
      linear-gradient(180deg, rgba(255,255,255,.96) 0%, rgba(248,248,248,.98) 18%, #fff 18%, #14151a 100%);
    overflow:hidden;
  }
  .homeFocusPhoneHeaderBar{
    position:absolute;
    top:34px;
    left:18px;
    width:78px;
    height:18px;
    border-radius:2px;
    background:linear-gradient(180deg, #f4f4f4 0%, #e6e6e6 100%);
  }
  .homeFocusPhoneHeaderLines{
    position:absolute;
    top:34px;
    right:18px;
    width:78px;
    height:26px;
    background:
      linear-gradient(180deg, rgba(168,179,194,.8) 0 2px, transparent 2px 8px, rgba(168,179,194,.6) 8px 10px, transparent 10px 16px, rgba(168,179,194,.55) 16px 18px, transparent 18px);
  }
  .homeFocusPhoneImageGlow{
    position:absolute;
    inset:88px 0 112px 0;
    background:
      linear-gradient(180deg, rgba(255,255,255,.08) 0%, rgba(255,255,255,0) 12%),
      linear-gradient(180deg, transparent 0 15%, rgba(239,80,76,.9) 15% 23%, transparent 23%),
      radial-gradient(circle at 26% 40%, rgba(182,211,91,.95) 0 12%, transparent 18%),
      radial-gradient(circle at 46% 50%, rgba(255,190,92,.9) 0 10%, transparent 16%),
      linear-gradient(180deg, rgba(107,144,48,.84) 0%, rgba(77,92,41,.70) 28%, rgba(92,71,52,.90) 74%, rgba(33,26,28,.96) 100%);
    filter:saturate(.9) blur(.2px);
  }
  .homeFocusPhoneBadge{
    position:absolute;
    left:50%;
    top:150px;
    transform:translateX(-50%);
    z-index:3;
    padding:12px 24px;
    border-radius:22px;
    background:linear-gradient(180deg, #FF8E47 0%, #FF7D2C 100%);
    color:#fff;
    font-size:34px;
    font-weight:900;
    box-shadow:0 14px 26px rgba(255,98,0,.22);
  }
  .homeFocusPhoneCode{
    position:absolute;
    left:50%;
    top:222px;
    transform:translateX(-50%);
    width:126px;
    height:78px;
    z-index:2;
    border-radius:16px;
    background:
      repeating-linear-gradient(90deg, #141414 0 2px, transparent 2px 5px),
      #fff;
    box-shadow:0 0 0 10px rgba(255,255,255,.95);
  }
  .homeFocusPhoneScanner{
    position:absolute;
    left:26px;
    right:26px;
    top:132px;
    bottom:122px;
    z-index:4;
  }
  .homeFocusPhoneScanner span{
    position:absolute;
    width:24px;
    height:24px;
    border-color:rgba(255,255,255,.95);
    border-style:solid;
    filter:drop-shadow(0 0 6px rgba(255,255,255,.22));
  }
  .homeFocusPhoneScanner span:nth-child(1){
    top:0; left:0;
    border-width:4px 0 0 4px;
    border-top-left-radius:10px;
  }
  .homeFocusPhoneScanner span:nth-child(2){
    top:0; right:0;
    border-width:4px 4px 0 0;
    border-top-right-radius:10px;
  }
  .homeFocusPhoneScanner span:nth-child(3){
    bottom:0; left:0;
    border-width:0 0 4px 4px;
    border-bottom-left-radius:10px;
  }
  .homeFocusPhoneScanner span:nth-child(4){
    bottom:0; right:0;
    border-width:0 4px 4px 0;
    border-bottom-right-radius:10px;
  }
  .homeFocusPhoneBeam{
    position:absolute;
    left:10px;
    right:10px;
    top:198px;
    height:8px;
    z-index:4;
    background:linear-gradient(90deg, transparent 0%, rgba(255,92,92,.95) 18%, rgba(255,255,255,.98) 50%, rgba(255,92,92,.95) 82%, transparent 100%);
    box-shadow:0 0 18px rgba(255,73,73,.55);
    border-radius:999px;
  }
  .homeFocusScanBtn{
    position:absolute;
    left:50%;
    right:auto;
    bottom:20px;
    transform:translateX(-50%);
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:14px;
    min-height:70px;
    min-width:min(100%, 540px);
    padding:14px 28px;
    border:none;
    border-radius:999px;
    background:linear-gradient(180deg, #FF9540 0%, #FF6200 100%);
    color:#fff;
    font-size:18px;
    font-weight:900;
    box-shadow:0 12px 0 rgba(170, 12, 24, .14), 0 16px 28px rgba(170, 12, 24, .22);
  }
  .homeFocusScanIcon{
    width:44px;
    height:44px;
    border-radius:14px;
    background:rgba(255,255,255,.16);
  }
  .homeFocusStatsWrap{
    padding:0;
  }
  .homeFocusStatsGrid{
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:14px;
    padding:16px;
    border-radius:28px;
    background:linear-gradient(180deg, #f2f3f6 0%, #eceef2 100%);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.9), 0 12px 22px rgba(20,20,20,.06);
  }
  .homeFocusStatCard{
    display:grid;
    justify-items:center;
    gap:8px;
    padding:16px 12px 18px;
    border:none;
    border-radius:20px;
    background:linear-gradient(180deg, rgba(255,255,255,.98) 0%, rgba(249,249,249,.94) 100%);
    box-shadow:0 10px 20px rgba(20,20,20,.08), inset 0 1px 0 rgba(255,255,255,.95);
    text-align:center;
    color:#2b3442;
  }
  .homeFocusStatArtwork{
    width:100%;
    min-height:82px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:16px;
    background:
      radial-gradient(90% 80% at 50% 100%, rgba(15,23,42,.06), transparent 62%),
      linear-gradient(180deg, #ffffff 0%, #f7f7f7 100%);
    overflow:hidden;
  }
  .homeFocusStatArtwork svg{
    width:78px;
    height:78px;
    display:block;
  }
  .homeFocusStatCard strong{
    font-size:17px;
    line-height:1.1;
    letter-spacing:-.04em;
    color:#303846;
    font-weight:900;
  }
  .homeFocusStatCard strong span{
    font-size:inherit;
    color:inherit;
  }
  .homeFocusStatCard small{
    font-size:12px;
    line-height:1.28;
    color:#5f6b7a;
  }
  .homeFocusInstallWrap{
    padding:0;
  }
  .homeFocusInstallCard{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    padding:18px 18px 18px 20px;
    border-radius:24px;
    background:linear-gradient(180deg, rgba(255,255,255,.98) 0%, rgba(248,248,248,.94) 100%);
    box-shadow:0 14px 24px rgba(20,20,20,.08), inset 0 1px 0 rgba(255,255,255,.95);
  }
  .homeFocusInstallCopy{
    display:grid;
    gap:4px;
  }
  .homeFocusInstallCopy strong{
    font-size:17px;
    line-height:1.12;
    color:#303846;
    font-weight:900;
  }
  .homeFocusInstallCopy span{
    font-size:13px;
    line-height:1.38;
    color:#66707d;
  }
  .homeFocusInstallBtn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:12px;
    min-width:190px;
    min-height:58px;
    border-radius:999px;
    box-shadow:0 10px 0 rgba(170, 12, 24, .12), 0 14px 24px rgba(170, 12, 24, .18);
  }
  .homeFocusInstallBtnIcon{
    width:24px;
    height:24px;
  }
  @media (max-width: 860px){
    .homeFocusBody{
      grid-template-columns:1fr;
      gap:0;
      margin-top:-70px;
    }
    .homeFocusHeroVisual{
      justify-content:flex-end;
      min-height:304px;
    }
    .homeFocusScanCopy{
      padding:62px 0 96px 8px;
    }
    .homeFocusScanBtn{
      min-width:calc(100% - 28px);
    }
    .homeFocusInstallCard{
      gap:14px;
    }
  }
  @media (max-width: 640px){
    .homeFocusShell{
      gap:14px;
    }
    .homeFocusTopBar{
      align-items:center;
      flex-direction:row;
      padding:0 2px;
    }
    .homeFocusLocationBtn{
      min-height:50px;
      padding:10px 16px;
      font-size:15px;
    }
    .homeFocusTopActions{
      grid-template-columns:repeat(2, 46px);
    }
    .homeFocusTopIcon{
      width:46px;
      height:46px;
    }
    .homeFocusHeroBanner{
      min-height:160px;
      padding:24px 18px 88px;
    }
    .homeFocusHeroBannerInner strong{
      font-size:32px;
    }
    .homeFocusHeroBannerInner{
      padding-right:0;
      max-width:18rem;
    }
    .homeFocusHeroBannerInner p{
      font-size:15px;
    }
    .homeFocusBody{
      margin-top:-58px;
      padding:0 14px 18px;
    }
    .homeFocusScanCopy{
      padding:38px 0 88px;
    }
    .homeFocusScanCopy h3{
      font-size:24px;
    }
    .homeFocusScanCopy p{
      font-size:13px;
    }
    .homeFocusHeroVisual{
      min-height:238px;
    }
    .homeFocusPhoneMock{
      width:180px;
      height:300px;
    }
    .homeFocusHand{
      width:118px;
      height:170px;
      bottom:8px;
    }
    .homeFocusPhoneBadge{
      top:120px;
      font-size:24px;
      padding:8px 16px;
    }
    .homeFocusPhoneCode{
      top:180px;
      width:98px;
      height:58px;
    }
    .homeFocusPhoneBeam{
      top:154px;
    }
    .homeFocusPhoneScanner{
      top:108px;
      bottom:92px;
    }
    .homeFocusScanBtn{
      width:calc(100% - 8px);
      min-height:62px;
      font-size:16px;
      gap:10px;
    }
    .homeFocusStatsGrid{
      gap:10px;
      padding:12px;
    }
    .homeFocusStatCard{
      padding:12px 8px 14px;
      min-width:0;
    }
    .homeFocusStatArtwork{
      min-height:62px;
    }
    .homeFocusStatArtwork svg{
      width:56px;
      height:56px;
    }
    .homeFocusStatCard strong{
      font-size:15px;
    }
    .homeFocusStatCard small{
      font-size:11px;
      line-height:1.24;
    }
    .homeFocusInstallBtn{
      min-width:160px;
    }
  }
  .dashboardCommand{
    position:relative;
    overflow:hidden;
    display:grid;
    gap:18px;
    padding:22px;
    border-radius:30px;
    background:
      radial-gradient(120% 120% at 100% 0%, rgba(81,21,181,.22), transparent 42%),
      radial-gradient(80% 120% at 0% 100%, rgba(255,98,0,.12), transparent 42%),
      linear-gradient(145deg, rgba(255,255,255,.96) 0%, rgba(247,250,252,.92) 100%);
    border:1px solid rgba(255,255,255,.72);
    box-shadow:0 24px 48px rgba(15,23,42,.09);
  }
  .dashboardMarketChance{
    display:block;
  }
  .dashboardMarketChance .dashboardSignalCard{
    border-radius:24px;
  }
  .marketChanceList{
    display:grid;
    gap:10px;
    margin-top:14px;
  }
  .marketChanceLabel{
    margin-top:16px;
    font-size:11px;
    font-weight:900;
    letter-spacing:.08em;
    text-transform:uppercase;
    color:rgba(255,255,255,.78);
  }
  .marketChanceItem{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    width:100%;
    padding:12px 14px;
    border:none;
    border-radius:18px;
    text-align:left;
    cursor:pointer;
    background:rgba(255,255,255,.12);
    border:1px solid rgba(255,255,255,.14);
    color:#fff;
    transition:transform .16s ease, background .16s ease, border-color .16s ease;
  }
  .marketChanceItem:hover{
    transform:translateY(-1px);
    background:rgba(255,255,255,.16);
    border-color:rgba(255,255,255,.24);
  }
  .marketChanceCopy{
    display:grid;
    gap:4px;
    min-width:0;
  }
  .marketChanceCopy b{
    font-size:14px;
    line-height:1.25;
    color:#fff;
  }
  .marketChanceCopy span{
    font-size:11px;
    line-height:1.4;
    color:rgba(255,255,255,.78);
  }
  .marketChanceMeta{
    display:grid;
    gap:2px;
    justify-items:end;
    flex:0 0 auto;
  }
  .marketChanceMeta small{
    font-size:11px;
    font-weight:900;
    color:#c7f0ff;
  }
  .marketChanceMeta strong{
    font-size:15px;
    line-height:1.1;
    color:#fff;
  }
  .marketChanceEmpty{
    margin-top:14px;
    padding:12px 14px;
    border-radius:18px;
    background:rgba(255,255,255,.10);
    border:1px solid rgba(255,255,255,.14);
    font-size:12px;
    line-height:1.5;
    color:rgba(255,255,255,.82);
  }
  .dashboardCommandHero{
    display:grid;
    grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr);
    gap:16px;
    align-items:stretch;
  }
  .dashboardEyebrow,
  .experienceEyebrow{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:8px 12px;
    border-radius:999px;
    background:rgba(255,98,0,.08);
    color:#B8500F;
    font-size:11px;
    font-weight:900;
    letter-spacing:.12em;
    text-transform:uppercase;
  }
  .dashboardTitle,
  .experienceTitle{
    margin-top:14px;
    font-size:clamp(28px, 4.5vw, 42px);
    line-height:1.02;
    letter-spacing:-.04em;
    font-weight:950;
    color:#16202a;
  }
  .dashboardSub,
  .experienceSub{
    margin-top:10px;
    max-width:64ch;
    color:#5a6774;
    font-size:14px;
    line-height:1.6;
  }
  .dashboardActionRow{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin-top:16px;
  }
  .dashboardActionRow .btn{
    min-height:50px;
    border-radius:18px;
  }
  .dashboardSignalStack{
    display:grid;
    gap:12px;
  }
  .dashboardSignalCard{
    display:grid;
    gap:8px;
    padding:16px;
    border-radius:22px;
    background:rgba(255,255,255,.84);
    border:1px solid rgba(15,23,42,.06);
    box-shadow:0 14px 28px rgba(15,23,42,.06);
  }
  .dashboardSignalCard.primary{
    background:linear-gradient(145deg, #5115B5 0%, #3A0F82 100%);
    color:#fff;
    border-color:rgba(255,255,255,.14);
  }
  .dashboardSignalCard.compact strong{
    font-size:18px;
  }
  .dashboardSignalCard span,
  .dashboardMetric span,
  .experienceCardTitle{
    font-size:11px;
    font-weight:900;
    letter-spacing:.08em;
    text-transform:uppercase;
  }
  .dashboardSignalCard strong{
    font-size:22px;
    line-height:1.08;
    letter-spacing:-.03em;
  }
  .dashboardSignalCard small{
    font-size:12px;
    line-height:1.5;
    color:#677483;
  }
  .dashboardSignalCard.primary small{
    color:rgba(255,255,255,.82);
  }
  .dashboardMetricGrid{
    display:grid;
    grid-template-columns:repeat(4, minmax(0,1fr));
    gap:12px;
  }
  .dashboardMetric{
    display:grid;
    gap:8px;
    padding:16px;
    border-radius:20px;
    background:rgba(255,255,255,.76);
    border:1px solid rgba(15,23,42,.06);
  }
  .dashboardMetric strong{
    font-size:24px;
    line-height:1;
    letter-spacing:-.04em;
    color:#101820;
  }
  .dashboardMetric small{
    font-size:12px;
    line-height:1.5;
    color:#657281;
  }
  .dashboardQuickGrid,
  .experienceModeGrid{
    display:grid;
    grid-template-columns:repeat(4, minmax(0,1fr));
    gap:12px;
  }
  .dashboardQuickCard,
  .experienceModeCard,
  .experienceNextStep{
    display:grid;
    gap:8px;
    width:100%;
    padding:16px;
    border:none;
    border-radius:22px;
    text-align:left;
    cursor:pointer;
    background:rgba(255,255,255,.84);
    border:1px solid rgba(15,23,42,.06);
    box-shadow:0 16px 28px rgba(15,23,42,.06);
    transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
  }
  .dashboardQuickCard.primary{
    background:linear-gradient(145deg, #fff1f2 0%, #ffffff 100%);
    border-color:rgba(255,98,0,.12);
  }
  .dashboardQuickCard:hover,
  .experienceModeCard:hover,
  .experienceNextStep:hover{
    transform:translateY(-2px);
    box-shadow:0 20px 32px rgba(15,23,42,.09);
    border-color:rgba(81,21,181,.18);
  }
  .dashboardQuickCard span,
  .experienceModeCard span,
  .experienceNextStep span{
    font-size:11px;
    font-weight:900;
    letter-spacing:.08em;
    text-transform:uppercase;
    color:#6a7786;
  }
  .dashboardQuickCard strong,
  .experienceModeCard strong,
  .experienceNextStep strong{
    font-size:20px;
    line-height:1.08;
    letter-spacing:-.03em;
    color:#14202a;
  }
  .dashboardQuickCard small,
  .experienceModeCard small,
  .experienceNextStep small{
    font-size:12px;
    line-height:1.5;
    color:#667382;
  }
  .experiencePanel{
    position:relative;
    overflow:hidden;
    display:grid;
    gap:18px;
    padding:22px;
    border-radius:30px;
    background:
      radial-gradient(96% 120% at 100% 0%, rgba(81,21,181,.16), transparent 42%),
      linear-gradient(145deg, #fffdf7 0%, #ffffff 52%, #f7fbff 100%);
    border:1px solid rgba(255,255,255,.72);
    box-shadow:0 22px 42px rgba(15,23,42,.08);
  }
  .experiencePanelTop{
    display:grid;
    grid-template-columns:minmax(0,1.15fr) minmax(260px,.85fr);
    gap:16px;
    align-items:start;
  }
  .experienceGrid{
    display:grid;
    grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
    gap:14px;
  }
  .experienceGrid.single{
    grid-template-columns:1fr;
  }
  .experienceCard{
    display:grid;
    gap:14px;
    padding:18px;
    border-radius:24px;
    background:rgba(255,255,255,.82);
    border:1px solid rgba(15,23,42,.06);
  }
  .experienceCard.accent{
    background:linear-gradient(145deg, rgba(81,21,181,.06) 0%, rgba(255,255,255,.9) 100%);
  }
  .experienceTimeline{
    display:grid;
    gap:12px;
  }
  .experienceTimelineItem{
    display:grid;
    grid-template-columns:auto 1fr;
    gap:12px;
    align-items:start;
  }
  .experienceTimelineItem strong{
    display:block;
    font-size:15px;
    line-height:1.3;
    color:#17212b;
  }
  .experienceTimelineItem small{
    display:block;
    margin-top:4px;
    font-size:12px;
    line-height:1.55;
    color:#657281;
  }
  .experienceDot{
    width:12px;
    height:12px;
    margin-top:4px;
    border-radius:50%;
    background:#cbd5e1;
    box-shadow:0 0 0 6px rgba(203,213,225,.24);
  }
  .experienceDot.good{
    background:#16a34a;
    box-shadow:0 0 0 6px rgba(22,163,74,.14);
  }
  .experienceDot.brand{
    background:#5115B5;
    box-shadow:0 0 0 6px rgba(81,21,181,.14);
  }
  .statusCardLoading,
  .statusCardError{
    padding:14px 16px;
    border-radius:18px;
    background:rgba(255,255,255,.7);
    border:1px solid rgba(15,23,42,.06);
  }
  .statusCardError{
    background:rgba(255,241,242,.82);
    border-color:rgba(255,98,0,.10);
  }
  @media (max-width: 820px){
    .dashboardCommandHero,
    .experiencePanelTop,
    .experienceGrid{
      grid-template-columns:1fr;
    }
    .dashboardMetricGrid,
    .dashboardQuickGrid,
    .experienceModeGrid{
      grid-template-columns:repeat(2, minmax(0,1fr));
    }
    .savingsRankTop{
      align-items:center;
      flex-direction:row;
    }
    .savingsRankTrack{
      height:84px;
      padding-left:84px;
    }
    .savingsRankCurrentBadge{
      font-size:11px;
      padding:6px 8px;
      max-width:74px;
      overflow:hidden;
      text-overflow:ellipsis;
    }
    .savingsRankStopValue{
      font-size:10px;
    }
  }

  .scanModeGrid{
    display:grid;
    grid-template-columns:repeat(3, minmax(0,1fr));
    gap:8px;
    margin-top:8px;
  }
  .scanModeGridSimple{
    grid-template-columns:1fr;
    gap:12px;
    margin-top:0;
  }
  .scanModeCard{
    display:grid;
    gap:4px;
    min-height:92px;
    padding:10px 11px;
    border:1px solid rgba(24,24,24,.07);
    border-radius:16px;
    text-align:left;
    cursor:pointer;
    color:#16202a;
    background:linear-gradient(180deg, rgba(255,255,255,.96) 0%, rgba(247,248,249,.98) 100%);
    box-shadow:none;
    transition:transform .16s ease, border-color .16s ease, background .16s ease;
  }
  .scanModeCard.primary{
    color:#fff;
    border-color:rgba(255,98,0,.18);
    background:linear-gradient(145deg, #B84300 0%, #FF6200 100%);
  }
  .scanModeCard span,
  .scanStatusBadge{
    font-size:11px;
    font-weight:900;
    letter-spacing:.08em;
    text-transform:uppercase;
  }
  .scanModeCard strong{
    font-size:15px;
    line-height:1.08;
    letter-spacing:-.04em;
  }
  .scanModeGridSimple .scanModeCard{
    min-height:82px;
    place-items:center;
    text-align:center;
  }
  .scanModeGridSimple .scanModeCard strong{
    font-size:20px;
  }
  .scanModeCard small{
    font-size:10px;
    line-height:1.35;
    color:inherit;
    opacity:.84;
  }
    .scanModeCard:hover{
      transform:translateY(-1px);
      border-color:rgba(24,24,24,.14);
    }
    .scanHiddenFile{
      display:none;
    }
    .reportCommentOptions{
      display:grid;
      grid-template-columns:repeat(auto-fit, minmax(150px, 1fr));
      gap:8px;
    }
    .reportCommentChip{
      display:flex;
      align-items:center;
      justify-content:flex-start;
      gap:8px;
      min-height:42px;
      padding:8px 10px;
      border-radius:14px;
      border:1px solid rgba(24,24,24,.10);
      background:rgba(255,255,255,.86);
      color:#52606d;
      font:inherit;
      font-size:12px;
      font-weight:800;
      line-height:1.15;
      cursor:pointer;
      text-align:left;
      transition:background .16s ease, border-color .16s ease, color .16s ease, transform .16s ease;
    }
    .reportCommentIcon{
      flex:0 0 auto;
      display:inline-grid;
      place-items:center;
      width:22px;
      height:22px;
      border-radius:999px;
      background:rgba(82,96,109,.10);
      color:currentColor;
    }
    .reportCommentIcon svg{
      width:15px;
      height:15px;
      fill:none;
      stroke:currentColor;
      stroke-width:2.3;
      stroke-linecap:round;
      stroke-linejoin:round;
    }
    .reportCommentChip.active{
      background:var(--primary);
      border-color:var(--primary);
      color:#ffffff;
      box-shadow:0 10px 20px rgba(255,98,0,.16);
    }
    .reportCommentChip.active .reportCommentIcon{
      background:rgba(255,255,255,.18);
    }
    .reportCommentChip:active{
      transform:scale(.98);
    }
    .scanStatusPanel{
      display:grid;
    gap:6px;
    margin-top:10px;
    padding:10px 12px;
    border-radius:14px;
    background:#f3f5f7;
    border:1px solid rgba(24,24,24,.06);
  }
  .scanStatusPanel[data-tone="good"]{
    background:#edf9f1;
    border-color:rgba(21,128,61,.16);
  }
  .scanStatusPanel[data-tone="warn"]{
    background:#f1f5f9;
    border-color:rgba(82,96,109,.16);
  }
  .scanStatusPanel[data-tone="bad"]{
    background:#FFF1E6;
    border-color:rgba(241,90,36,.16);
  }
  .scanStatusTop{
    display:flex;
    gap:8px;
    align-items:flex-start;
    justify-content:flex-start;
  }
  .scanStatusMeta{
    font-size:11px;
    color:#66707d;
  }
  .scanManualEntry{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:8px;
    margin-top:10px;
    align-items:end;
  }
  .scanMiniBtn{
    min-height:36px;
    padding:0 12px;
    border-radius:12px;
    font-size:12px;
    font-weight:700;
  }

  @media (max-width: 980px){
    .scanModeGrid{
      grid-template-columns:repeat(2, minmax(0,1fr));
    }
  }
  @media (max-width: 640px){
    .scanModeGrid,
    .scanManualEntry{
      grid-template-columns:1fr;
    }
    .scanStatusTop{
      align-items:flex-start;
      justify-content:flex-start;
    }
    .sectionBlock{
      padding-top:2px;
    }
    .dashboardCommand,
    .experiencePanel{
      padding:18px 16px;
      border-radius:24px;
    }
    .dashboardMetricGrid,
    .dashboardQuickGrid,
    .experienceModeGrid{
      grid-template-columns:1fr;
    }
  }

    @media (max-width: 640px){
      .dashboardTopBar{
        gap:8px;
      }
      .dashboardLiveStatus{
        width:100%;
        font-size:10px;
      }
      .dashboardControlsPanel{
        padding:8px 10px;
      }
      .categoryBar{
        gap:6px;
      }
      .catChip{
        min-height:34px;
        padding:0 10px;
      }
      .controlChip{
        min-height:34px;
        padding:7px 11px;
      }
    }

/* Final product polish overrides */
.nav{
  background:rgba(255,255,255,.98);
  border-top:1px solid rgba(15,23,42,.08);
  box-shadow:0 -10px 26px rgba(15,23,42,.06);
}
.tab{
  color:#7a8290;
}
.tab.active,
.tab.active .tabIcon{
  color:var(--accent);
}
.fab{
  background:linear-gradient(180deg, #FF7A1A 0%, #F05A00 100%);
  box-shadow:0 12px 26px rgba(240,90,0,.24), 0 0 0 6px rgba(255,255,255,.94);
}
.filterSummaryBlock{
  display:grid;
  grid-auto-rows:max-content;
  align-items:start;
}
.filterSheetCard .filterSummaryEmpty{
  width:min(100%, 360px);
  height:46px;
  min-height:46px;
  max-height:46px;
  padding:0 16px;
  gap:10px;
  border-radius:18px;
  font-size:13px;
  line-height:1;
  align-self:start;
  overflow:hidden;
}
.filterCloseBtn{
  width:38px;
  height:38px;
  box-shadow:none;
}
.filterSectionCard{
  padding:18px;
  border-radius:20px;
}
.filterGeoAction{
  min-height:78px;
}
.filterSheetActions .btn{
  min-height:48px;
  font-size:13px;
}

/* Final trust polish - must stay last */
.nav{
  background:rgba(255,255,255,.98);
  border-top:1px solid rgba(15,23,42,.08);
  box-shadow:0 -10px 26px rgba(15,23,42,.06);
}
.tab{ color:#7a8290; }
.tab.active,
.tab.active .tabIcon{ color:var(--accent); }
.fab{
  background:linear-gradient(180deg, #FF7A1A 0%, #F05A00 100%);
  box-shadow:0 12px 26px rgba(240,90,0,.24), 0 0 0 6px rgba(255,255,255,.94);
}
.filterSummaryBlock{
  display:grid;
  grid-auto-rows:max-content;
  align-items:start;
}
.filterSheetCard .filterSummaryEmpty{
  width:min(100%, 360px);
  height:46px;
  min-height:46px;
  max-height:46px;
  padding:0 16px;
  gap:10px;
  border-radius:18px;
  font-size:13px;
  line-height:1;
  align-self:start;
  overflow:hidden;
}
.filterContextLine{
  color:#687385;
  font-size:12px;
  line-height:1.35;
  font-weight:650;
}
.filterCloseBtn{
  width:38px;
  height:38px;
  box-shadow:none;
}
.filterSectionCard{
  padding:18px;
  border-radius:20px;
}
.filterGeoAction{ min-height:78px; }
.filterSheetActions .btn{
  min-height:48px;
  font-size:13px;
}
.emptyStateCard{
  border:1px solid rgba(15,23,42,.08);
  background:#fff;
  border-radius:22px;
  box-shadow:0 10px 24px rgba(15,23,42,.045);
}
.emptyStateBadge{
  background:#f5efff;
  color:var(--accent);
  border:1px solid rgba(81,21,181,.10);
}
.emptyStateTitle{
  color:#172033;
  font-size:18px;
  letter-spacing:0;
}
.emptyStateText{ color:#687385; }
.toast{
  max-width:min(calc(100vw - 28px), 420px);
  border:1px solid rgba(15,23,42,.08);
  border-radius:16px;
  box-shadow:0 18px 36px rgba(15,23,42,.14);
}
input::placeholder{ color:#8a93a3; opacity:1; }
input,
select,
textarea{ border-color:rgba(15,23,42,.10); }

/* 2026 glow-up: centered mobile cards, modern scanner, livelier surfaces */
:root{
  --bg:#f6f7fb;
  --text:#172033;
  --muted:#667085;
  --shadow-panel:0 14px 34px rgba(15,23,42,.075);
  --shadow-lg:0 22px 54px rgba(15,23,42,.16);
}

body{
  background:
    linear-gradient(180deg, #fbfbfd 0%, #f4f6fb 48%, #eef3f8 100%);
}

body::before{
  background:
    radial-gradient(38% 46% at 12% 0%, rgba(255,98,0,.12), transparent 68%),
    radial-gradient(34% 42% at 88% 6%, rgba(81,21,181,.12), transparent 66%),
    radial-gradient(32% 38% at 52% -8%, rgba(21,128,61,.08), transparent 64%);
  opacity:.95;
}

.card,
.ambientPanel,
.emptyStateCard,
.dealCard{
  transition:transform .22s cubic-bezier(.22,.8,.18,1), box-shadow .22s ease, border-color .22s ease;
}

@media (hover:hover){
  .card:hover,
  .emptyStateCard:hover,
  .dealCard.item:hover{
    transform:translateY(-2px);
    box-shadow:0 18px 42px rgba(15,23,42,.095);
    border-color:rgba(255,98,0,.16);
  }
}

main{
  display:block;
}

.stack{
  justify-items:stretch;
}

.dealList{
  width:100%;
}

.dealList.centered{
  justify-content:center;
  justify-items:center;
}

.dealList.centered > .dealCard{
  width:min(100%, 292px);
}

.dealRail > .dealCard,
.dealCard.compactStatic{
  width:250px;
}

.dealCard{
  border-radius:20px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.98) 0%, rgba(248,250,252,.96) 100%);
  box-shadow:0 12px 30px rgba(15,23,42,.07);
}

.dealMedia{
  height:148px;
}

.ititle,
.dealCard .ititle{
  font-size:16px;
  line-height:1.22;
  letter-spacing:0;
  color:#162033;
}

.emptyStateCard{
  width:min(100%, 430px);
  margin-inline:auto;
  padding:22px 18px;
  text-align:center;
  justify-items:center;
  border-radius:24px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,250,252,.96));
  box-shadow:0 16px 42px rgba(15,23,42,.075);
}

.emptyStateBadge{
  margin-inline:auto;
}

.emptyStateTitle{
  font-family:var(--font-display);
  font-size:20px;
  line-height:1.12;
}

.emptyStateText{
  max-width:32ch;
  margin-inline:auto;
  font-size:13px;
  line-height:1.45;
}

.emptyStateActions{
  justify-content:center;
  width:100%;
}

.toast{
  left:50%;
  width:min(calc(100vw - 28px), 430px);
  padding:14px 15px;
  border-radius:20px;
  background:rgba(255,255,255,.92);
  font-size:13px;
  line-height:1.35;
}

.scanLayer{
  display:grid;
  place-items:end center;
  background:
    radial-gradient(42% 38% at 50% 2%, rgba(255,98,0,.22), transparent 60%),
    radial-gradient(44% 42% at 100% 20%, rgba(81,21,181,.18), transparent 62%),
    rgba(12,18,28,.48);
}

.scanLayerInner{
  left:auto;
  right:auto;
  width:min(100%, 560px);
  max-height:min(92dvh, 760px);
  border-radius:30px 30px 0 0;
  padding:12px 14px calc(116px + env(safe-area-inset-bottom, 0px));
  background:
    linear-gradient(180deg, rgba(255,255,255,.98) 0%, rgba(246,248,252,.98) 100%);
}

.scanLayerTop{
  border-bottom:0;
  margin-bottom:10px;
}

.scanLayerTop .title{
  font-family:var(--font-display);
  font-size:22px;
  letter-spacing:0;
}

.scanCard{
  position:relative;
  overflow:hidden;
  display:grid;
  gap:14px;
  padding:16px;
  border-radius:26px;
  border:1px solid rgba(15,23,42,.08);
  background:
    linear-gradient(180deg, rgba(255,255,255,.96), rgba(248,250,252,.92));
  box-shadow:0 18px 46px rgba(15,23,42,.10);
}

.scanHeroPulse{
  position:absolute;
  inset:10px 10px auto auto;
  display:flex;
  gap:5px;
  pointer-events:none;
}

.scanHeroPulse span{
  width:7px;
  height:7px;
  border-radius:999px;
  background:var(--primary);
  opacity:.28;
  animation:scanPulse 1.25s ease-in-out infinite;
}

.scanHeroPulse span:nth-child(2){ animation-delay:.16s; }
.scanHeroPulse span:nth-child(3){ animation-delay:.32s; }

@keyframes scanPulse{
  0%, 100%{ transform:translateY(0) scale(.9); opacity:.28; }
  50%{ transform:translateY(-4px) scale(1.12); opacity:.76; }
}

.scanModernHero{
  padding:18px;
  border-radius:22px;
  background:
    radial-gradient(80% 110% at 100% 0%, rgba(255,98,0,.18), transparent 58%),
    linear-gradient(135deg, #ffffff 0%, #f3f5fb 100%);
}

.scanIntroHero h3{
  max-width:15ch;
  font-family:var(--font-display);
  font-size:25px;
  line-height:1.02;
  letter-spacing:0;
}

.scanIntroHero p{
  max-width:36ch;
  font-size:13px;
}

.scanModeGridSimple{
  gap:10px;
}

.scanModeCard{
  position:relative;
  grid-template-columns:auto minmax(0,1fr);
  align-items:center;
  gap:4px 12px;
  min-height:86px;
  padding:14px;
  border-radius:20px;
  background:#fff;
  box-shadow:0 10px 24px rgba(15,23,42,.055);
}

.scanModeGridSimple .scanModeCard{
  place-items:initial;
  text-align:left;
}

.scanModeCard.primary{
  background:
    radial-gradient(90% 120% at 100% 0%, rgba(255,255,255,.22), transparent 58%),
    linear-gradient(135deg, #ff7a1a 0%, #f05a00 100%);
  box-shadow:0 16px 30px rgba(240,90,0,.20);
}

.scanModeIcon{
  grid-row:1 / span 2;
  display:grid;
  place-items:center;
  width:44px;
  height:44px;
  border-radius:16px;
  background:rgba(15,23,42,.06);
  color:#172033;
}

.scanModeCard.primary .scanModeIcon{
  background:rgba(255,255,255,.18);
  color:#fff;
}

.scanModeIcon svg{
  width:23px;
  height:23px;
  fill:none;
  stroke:currentColor;
  stroke-width:2.1;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.scanModeGridSimple .scanModeCard strong{
  font-size:17px;
  line-height:1.12;
  letter-spacing:0;
}

.scanModeCard small{
  font-size:12px;
  line-height:1.35;
}

.scannerWrap{
  min-height:360px;
  border-radius:26px;
  border:1px solid rgba(255,255,255,.14);
  box-shadow:0 20px 48px rgba(2,6,23,.26);
}

.scannerVideo,
.scannerFallback,
.scannerFallback video{
  height:360px;
}

.scanFrame{
  left:8%;
  right:8%;
  top:18%;
  bottom:18%;
  border-radius:28px;
  border-color:rgba(255,255,255,.94);
  box-shadow:
    0 0 0 999px rgba(2,6,23,.34),
    inset 0 0 0 1px rgba(255,255,255,.22),
    0 0 38px rgba(255,98,0,.28);
}

.scanFrameCorners span{
  color:#ff8a2a;
  filter:drop-shadow(0 0 12px rgba(255,138,42,.62));
}

.scanLine{
  height:3px;
  background:linear-gradient(90deg, transparent, rgba(255,138,42,.96) 18%, #fff 50%, rgba(255,138,42,.96) 82%, transparent);
}

.scanStatusPanel{
  border-radius:18px;
  padding:12px 14px;
  background:rgba(255,255,255,.82);
  box-shadow:0 10px 22px rgba(15,23,42,.06);
}

@media (max-width:640px){
  main{
    padding-inline:14px;
  }

  .stack,
  .sectionBlock,
  .dealList{
    width:100%;
    justify-items:center;
  }

  .card,
  .ambientPanel,
  .emptyStateCard{
    width:min(100%, 430px);
    margin-inline:auto;
  }

  .dealList.centered > .dealCard,
  .dealRail > .dealCard,
  .dealCard.compactStatic{
    width:min(100%, 292px);
    max-width:292px;
  }

  main[data-view="home"] .homeProductList > .dealCard{
    width:min(100%, 430px);
    max-width:430px;
  }

  .dealMedia{
    height:154px;
  }

  .scanLayerInner{
    width:100%;
    max-height:94dvh;
    padding-inline:14px;
  }

  .scanCard{
    width:100%;
    padding:14px;
    border-radius:24px;
  }

  .scanIntroHero h3{
    font-size:23px;
  }

  .scannerWrap{
    min-height:330px;
  }

  .scannerVideo,
  .scannerFallback,
  .scannerFallback video{
    height:330px;
  }
}

@media (prefers-reduced-motion: reduce){
  .scanHeroPulse span,
  .scanLine,
  .scanGlow{
    animation:none;
  }

  .card,
  .ambientPanel,
  .emptyStateCard,
  .dealCard,
  .scanModeCard{
    transition:none;
  }
}

/* Savings-app upgrade */
.prototypeActionDock{
  display:grid;
  grid-template-columns:1.15fr 1fr 1fr;
  gap:10px;
  width:100%;
}

.prototypeAction{
  appearance:none;
  border:1px solid rgba(15,23,42,.08);
  border-radius:22px;
  min-height:92px;
  padding:12px;
  display:flex;
  align-items:center;
  gap:11px;
  text-align:left;
  color:#172033;
  background:
    linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,250,252,.95));
  box-shadow:0 12px 30px rgba(15,23,42,.07);
  cursor:pointer;
  font:inherit;
  transition:transform .18s cubic-bezier(.22,.8,.18,1), box-shadow .18s ease, border-color .18s ease;
}

.prototypeAction.primary{
  color:#fff;
  border-color:rgba(255,98,0,.22);
  background:
    radial-gradient(100% 130% at 100% 0%, rgba(255,255,255,.24), transparent 58%),
    linear-gradient(135deg, #ff7a1a 0%, #f05a00 100%);
  box-shadow:0 16px 34px rgba(240,90,0,.22);
}

@media (hover:hover){
  .prototypeAction:hover{
    transform:translateY(-2px);
    box-shadow:0 18px 38px rgba(15,23,42,.10);
    border-color:rgba(255,98,0,.18);
  }
}

.prototypeActionIcon{
  flex:0 0 auto;
  display:grid;
  place-items:center;
  width:42px;
  height:42px;
  border-radius:16px;
  color:#172033;
  background:rgba(15,23,42,.06);
}

.prototypeAction.primary .prototypeActionIcon{
  color:#fff;
  background:rgba(255,255,255,.18);
}

.prototypeActionIcon svg{
  width:23px;
  height:23px;
  fill:none;
  stroke:currentColor;
  stroke-width:2.1;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.prototypeAction span:last-child{
  min-width:0;
  display:grid;
  gap:4px;
}

.prototypeAction strong{
  font-family:var(--font-display);
  font-size:18px;
  line-height:1;
  letter-spacing:0;
  overflow:hidden;
  text-overflow:ellipsis;
}

.prototypeAction small{
  color:currentColor;
  opacity:.68;
  font-size:12px;
  line-height:1.2;
  font-weight:800;
}

.homeValueHero{
  grid-template-columns:minmax(0, 1fr) minmax(190px, .48fr);
  align-items:stretch;
  gap:16px;
}

.homeValueHero::after{
  content:"";
  position:absolute;
  inset:auto 18px 16px auto;
  width:92px;
  height:92px;
  border-radius:999px;
  background:conic-gradient(from 190deg, rgba(255,98,0,.22), rgba(81,21,181,.20), rgba(21,128,61,.16), rgba(255,98,0,.22));
  filter:blur(18px);
  opacity:.8;
  pointer-events:none;
}

.homeValueHeroCopy{
  display:grid;
  align-content:start;
}

.homeValueHeroTitle{
  max-width:12ch;
  font-size:clamp(36px, 5.6vw, 62px);
  letter-spacing:0;
}

.homeSavingsMeter{
  position:relative;
  display:grid;
  align-content:center;
  gap:8px;
  min-height:178px;
  padding:18px;
  border-radius:24px;
  overflow:hidden;
  color:#fff;
  background:
    radial-gradient(90% 110% at 100% 0%, rgba(255,255,255,.22), transparent 58%),
    linear-gradient(145deg, #162033 0%, #24324a 52%, #0f4228 100%);
  box-shadow:0 18px 40px rgba(15,23,42,.18);
}

.homeSavingsMeter::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.18), transparent);
  transform:translateX(-120%);
  animation:savingsShine 4.8s ease-in-out infinite;
}

@keyframes savingsShine{
  0%, 55%{ transform:translateX(-120%); }
  78%, 100%{ transform:translateX(120%); }
}

.homeSavingsMeter span,
.homeSavingsMeter strong,
.homeSavingsMeter small,
.homeSavingsMeterLine{
  position:relative;
  z-index:1;
}

.homeSavingsMeter span{
  font-size:11px;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:rgba(255,255,255,.72);
}

.homeSavingsMeter strong{
  font-family:var(--font-display);
  font-size:42px;
  line-height:.95;
  letter-spacing:0;
}

.homeSavingsMeter small{
  max-width:22ch;
  color:rgba(255,255,255,.78);
  font-size:12px;
  line-height:1.35;
  font-weight:750;
}

.homeSavingsMeterLine{
  height:10px;
  margin-top:6px;
  border-radius:999px;
  overflow:hidden;
  background:rgba(255,255,255,.18);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);
}

.homeSavingsMeterLine i{
  display:block;
  height:100%;
  min-width:10px;
  border-radius:inherit;
  background:linear-gradient(90deg, #ffd447 0%, #ff8a2a 55%, #ffffff 100%);
  box-shadow:0 0 22px rgba(255,212,71,.45);
}

.homeHotDeal{
  background:
    linear-gradient(180deg, rgba(255,255,255,.98), rgba(245,248,252,.94));
}

.homeHotDeal::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  pointer-events:none;
  background:linear-gradient(135deg, rgba(255,98,0,.10), transparent 42%, rgba(81,21,181,.08));
  opacity:.72;
}

.homeHotDeal > *{
  position:relative;
  z-index:1;
}

.homePulseItem{
  position:relative;
  overflow:hidden;
}

.homePulseItem::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(135deg, rgba(255,98,0,.07), transparent 48%);
  pointer-events:none;
}

.homePulseItem strong,
.homePulseItem span{
  position:relative;
  z-index:1;
}

.savingsRankCard{
  position:relative;
  background:
    radial-gradient(80% 120% at 100% 0%, rgba(255,98,0,.10), transparent 58%),
    #ffffff;
}

.savingsRankFill{
  background:linear-gradient(90deg, #ffd447 0%, #ff8a2a 42%, #FF6200 100%);
  box-shadow:0 0 24px rgba(255,98,0,.26);
}

@media (max-width:640px){
  .prototypeActionDock{
    grid-template-columns:1fr;
    width:min(100%, 430px);
    margin-inline:auto;
  }

  .prototypeAction{
    min-height:74px;
  }

  .homeValueHero{
    grid-template-columns:1fr;
    width:min(100%, 430px);
    margin-inline:auto;
  }

  .homeValueHeroTitle{
    max-width:11ch;
    font-size:34px;
  }

  .homeSavingsMeter{
    min-height:154px;
  }

  .homeSavingsMeter strong{
    font-size:38px;
  }

  .homeHotDeal{
    grid-template-columns:92px minmax(0,1fr);
  }

  .homePulseGrid{
    width:100%;
  }
}

@media (prefers-reduced-motion: reduce){
  .homeSavingsMeter::before{
    animation:none;
  }
}