/* Homepage material: continuous blue glass with clear, solid typography. */
#home-view {
  --glass-blur: blur(16px) saturate(1.1) brightness(0.92);
  --reading-face: #163f571f;
  --reading-face-alt: #d7f3ff0a;
  --reading-muted: #e0eef5;
  --reading-border: #b3dceb52;
  --content-control-face: #17475f33;
  --content-control-hover: #245c7580;
  --muted: #e0eef5;
  color: #f5fbff;
}

@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  #home-view {
    --panel-face:
      linear-gradient(160deg, #a5daeb0d, transparent 32%),
      linear-gradient(165deg, #1f587259, #143f5880);
    --card-face: linear-gradient(160deg, #2d5c7466, #19445c99);
    --card-hover-face: linear-gradient(160deg, #376c8480, #215369ad);
    --glass-control-face: linear-gradient(165deg, #34728e59, #24526c8c);
    --glass-control-hover: linear-gradient(165deg, #3c809b80, #2c617aa6);
  }

  body:has(#home-view:not([hidden])) .topbar.site-header {
    background: var(--glass-navigation-face);
  }
}

/* Keep the existing landscape and panel contours visible. Text stays solid. */
#home-view .search-summary {
  max-width: 100%;
  padding: 0;
  background: none;
  color: #06283f;
  font-size: 15px;
  font-weight: 800;
  line-height: 1.5;
  text-shadow: 0 1px 0 #dcf5ff80;
}

#home-view .search-bar {
  background: var(--glass-control-face);
}

#home-view #hero-input {
  color: #f5fbff;
  font-size: 16px;
}

#home-view #hero-input::placeholder {
  color: #e0eef5;
  opacity: 1;
}

#home-view .hero-actions a {
  color: #f5fbff;
  font-size: 14px;
}

#home-view :is(.section-bar h2, .offer-notice h2) {
  color: #f5fbff;
  font-size: 18px;
  line-height: 1.3;
  text-shadow: 0 1px 2px #031b2dcc;
}

#home-view :is(.section-action, .daily-quest-planner, .category-footer a) {
  color: #a9fff0;
  font-size: 13px;
  font-weight: 700;
}

#home-view :is(.home-empty, .home-saved-caption, .category-footer, .home-price-context) {
  color: var(--reading-muted);
  font-size: 13px;
  line-height: 1.6;
  font-weight: 600;
  text-shadow: 0 1px 2px #031b2dcc;
}

#home-view :is(.home-empty, .home-saved-caption) {
  max-width: 100%;
  padding: 0;
  background: none;
}

#home-view .home-empty {
  margin-inline: auto;
}

#home-view .offer-notice p {
  margin: 12px 0 0;
  padding: 0;
  background: none;
  color: #f5fbff;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.6;
  text-shadow: 0 1px 2px #031b2dcc;
}

#home-view .offer-notice p strong {
  color: #a9fff0;
}

#home-view .daily-quest-item {
  color: #f5fbff;
  font-size: 14px;
}

#home-view #daily-quest .daily-quest-item-copy strong {
  color: #f5fbff;
  font-size: 14px;
  line-height: 1.4;
}

#home-view .daily-quest-item small {
  color: var(--reading-muted);
  font-size: 12px;
}

#home-view #popular-price-grid .home-price-head {
  grid-template-rows: 32px 24px 20px;
  padding: 0;
  background: none;
  text-shadow: 0 1px 2px #031b2dcc;
}

#home-view #popular-price-grid .home-price-head > strong {
  font-size: 13px;
  line-height: 16px;
}

#home-view #popular-price-grid .home-price-value {
  color: #f5fbff;
  font-size: 20px;
  line-height: 24px;
}

#home-view #popular-price-grid .home-price-foot {
  color: var(--reading-muted);
  font-size: 12px;
}

#home-view .market-overview {
  padding: 14px 0;
  border-inline: 0;
  border-radius: 0;
  background: none;
}

#home-view .market-overview span {
  color: var(--reading-muted);
  font-size: 12px;
}

/* Give narrow-card prices their own full-width line beside a separate label row. */
@media (max-width: 360px) {
  #home-view #popular-price-grid .home-price-head {
    grid-template-columns: 24px minmax(0, 1fr);
    grid-template-rows: minmax(32px, auto) minmax(28px, auto) 20px;
    column-gap: 6px;
  }

  #home-view #popular-price-grid .home-price-icon {
    grid-row: 1;
  }

  #home-view #popular-price-grid .home-price-icon :is(.tick, img) {
    width: 24px;
    height: 24px;
  }

  #home-view #popular-price-grid :is(.home-price-value, .home-price-change) {
    grid-column: 1 / -1;
  }
}

@media (prefers-reduced-transparency: reduce), (prefers-contrast: more) {
  #home-view {
    --glass-blur: none;
    --panel-face: #244f66;
    --card-face: #244f66;
    --card-hover-face: #2b5c74;
    --glass-control-face: #24526c;
    --glass-control-hover: #356c84;
    --reading-face: #123b53;
    --reading-face-alt: #1b4962;
    --content-control-face: #17475f;
    --content-control-hover: #245c75;
  }

  body:has(#home-view:not([hidden])) .topbar.site-header {
    background: #26566f;
  }

}

@media (forced-colors: active) {
  #home-view {
    --glass-blur: none;
  }

  #home-view :is(.search-summary, .home-empty, .home-saved-caption, .offer-notice p,
    .home-price-head, .market-overview) {
    background: Canvas;
    color: CanvasText;
  }

  body:has(#home-view:not([hidden])) .topbar.site-header {
    background: Canvas;
  }
}