.for-you-page[hidden], .for-you-home[hidden], [data-page="shop"][data-for-you-mode] #shop,
.for-you-settings [hidden],
[data-page="home"]:has(.for-you-home:not([hidden])) #best-sellers { display: none; }

.for-you-page { --fy-ink: #f7edff; --fy-muted: #cbbcd8; --fy-mint: #9df5d9; padding-block: 16px 44px; color: var(--fy-ink); }
.for-you-hero {
  display: flex;
  min-height: 202px;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  padding: clamp(20px, 4.5vw, 56px);
  border: 1px solid #8e62b37a;
  border-radius: 20px;
  background: linear-gradient(100deg, #120920 12%, #170b27ce 46%, #1b123147 100%), url("assets/vybe-prism.jpg") 72% 45% / cover;
  box-shadow: 0 18px 40px #0904126e, inset 0 1px #e0b5ff29;
}
.for-you-hero h1 { margin: 0 0 7px; font: 800 clamp(42px, 7.3vw, 88px)/.98 var(--font, system-ui); letter-spacing: -.07em; }
.for-you-hero h1 em { font-style: normal; color: #c8a3ff; }
.for-you-hero p:not(.eyebrow), .for-you-empty p, .for-you-settings p { color: var(--fy-muted); max-width: 54ch; line-height: 1.55; }
.for-you-hero .eyebrow { margin-bottom: 10px; }
.for-you-tags, .for-you-actions { display: flex; flex-wrap: wrap; gap: 7px; }
.for-you-tags:not(:empty) { margin-top: 15px; }
.for-you-tags span { border: 1px solid #d4b5f76e; border-radius: 100px; padding: 5px 10px; background: #231331b5; color: #ead7ff; font-size: .82rem; }
.for-you-secondary {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  justify-content: center;
  min-height: 43px;
  padding: 8px 13px;
  border: 1px solid #b08dc661;
  border-radius: 9px;
  background: #221630;
  color: #f5e9ff;
  font: inherit;
  font-size: .88rem;
  font-weight: 700;
  text-decoration: none;
  cursor: pointer;
}
.for-you-secondary:is(:hover, :focus-visible) { border-color: #a7f4d9; color: #b5ffe7; }
.for-you-hero > .for-you-secondary { flex: none; }
.for-you-empty, .for-you-settings {
  margin-top: 16px;
  padding: clamp(16px, 3vw, 30px);
  border: 1px solid #735792;
  border-radius: 14px;
  background: linear-gradient(126deg, #241733, #15101f);
}
.for-you-empty h2, .for-you-pick h2, .for-you-more h2, .for-you-home h2 {
  margin: 0 0 9px;
  color: #f7edff;
  font: 800 clamp(23px, 3vw, 34px)/1.1 var(--font, system-ui);
  letter-spacing: -.03em;
}
.for-you-empty .for-you-actions { margin-top: 13px; }
.for-you-pick, .for-you-more { margin-top: clamp(18px, 3.5vw, 34px); }
.for-you-pick .curated-card { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .9fr); border-color: #b385d3; background: linear-gradient(135deg, #27193b, #181025); }
.for-you-pick .curated-card .product-picture { aspect-ratio: 1.68; min-block-size: 190px; max-block-size: 340px; }
.js .for-you-pick .curated-card[data-reveal-card] { opacity: 1; translate: none; }
.for-you-pick .curated-card-copy { align-self: center; padding: clamp(16px, 4vw, 46px); }
.for-you-pick .product-title { font-size: clamp(19px, 3vw, 37px); }
.for-you-reason { color: #aaf3dc; margin: 3px 0 8px; font-size: .85rem; font-weight: 700; }
.for-you-more .catalog-items, .for-you-home .catalog-items { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.for-you-settings { scroll-margin-top: 96px; }
.for-you-settings summary { cursor: pointer; color: #e9d5ff; font-weight: 800; }
.for-you-settings p { margin: 12px 0; }
.for-you-settings form { margin: 0; }
.for-you-home { padding-block: 13px 21px; }
.for-you-home header { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 5px 12px; margin-bottom: 9px; }
.for-you-home h2 { margin: 0; }
.for-you-home .eyebrow { margin-bottom: 5px; }
.desktop-nav [data-for-you-link][aria-current="page"], .mobile-nav [data-for-you-link][aria-current="page"] { color: #b1f6de; }

@media (max-width: 660px) {
  .for-you-hero { align-items: flex-start; flex-direction: column; min-height: 0; }
  .for-you-pick .curated-card { grid-template-columns: minmax(0, 1fr); }
  .for-you-pick .curated-card .product-picture { min-block-size: 0; }
  .for-you-more .catalog-items, .for-you-home .catalog-items { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (prefers-reduced-motion: no-preference) {
  .for-you-hero, .for-you-pick { animation: for-you-settle 320ms cubic-bezier(.2,.7,.25,1) backwards; }
}
@keyframes for-you-settle { from { opacity: .75; transform: translateY(5px); } }