/* v3.0 front mobile interaction polish */
.front-view-switch .view-btn{display:grid;place-items:center;padding:0}
.view-icon{width:18px;height:18px;display:grid;gap:3px;transition:.18s ease}
.view-icon.view-grid{grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(2,1fr)}
.view-icon.view-grid i{display:block;border-radius:2px;background:currentColor}
.view-icon.view-list{grid-template-columns:1fr;grid-template-rows:repeat(3,1fr);gap:3px}
.view-icon.view-list i{display:none}
.view-icon.view-list i:nth-child(-n+3){display:block;height:3px;margin:auto 0;border-radius:999px;background:currentColor}

.product-title-row{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}
.product-title-row h3{min-width:0;flex:1}
.product-open-mark{flex:0 0 auto;width:22px;height:22px;border-radius:999px;display:grid;place-items:center;background:#f6ece6;color:#9b6755;font-size:12px;font-weight:800;transition:.15s ease}
.product-body.has-xianyu-action{cursor:pointer}
.product-body.has-xianyu-action:hover .product-open-mark{background:#ead7cc;transform:translate(1px,-1px)}
.product-body.has-xianyu-action:focus-visible{outline:2px solid rgba(201,137,114,.28);outline-offset:-3px;border-radius:13px}
.product-actions:empty{display:none}

/* Modal close button must stay perfectly circular on narrow screens. */
.xianyu-open-modal .modal-title-row{position:relative;min-width:0}
.xianyu-open-modal .modal-title-row>div{min-width:0;flex:1}
.xianyu-open-modal .modal-x{box-sizing:border-box!important;flex:0 0 38px!important;width:38px!important;min-width:38px!important;max-width:38px!important;height:38px!important;min-height:38px!important;max-height:38px!important;aspect-ratio:1/1;border-radius:50%!important;padding:0!important;margin:0!important;display:grid!important;place-items:center!important;font-size:24px!important;line-height:1!important}

@media(max-width:620px){
  /* Grid cards: remove the old large CTA and tighten vertical rhythm. */
  .products-grid:not(.mobile-list-view) .product-body{padding:10px 10px 11px}
  .products-grid:not(.mobile-list-view) .product-body h3{font-size:13px;margin:0 0 5px;line-height:1.35}
  .products-grid:not(.mobile-list-view) .price{font-size:16px;line-height:1.2;margin-top:2px}
  .products-grid:not(.mobile-list-view) .meta{gap:5px;margin:7px 0 0}
  .products-grid:not(.mobile-list-view) .badge{font-size:10px;padding:4px 7px}
  .products-grid:not(.mobile-list-view) .product-actions{margin-top:7px}
  .products-grid:not(.mobile-list-view) .product-actions .btn{min-height:34px;padding:6px 9px;font-size:11px}
  .products-grid:not(.mobile-list-view) .product-open-mark{width:20px;height:20px;font-size:11px}

  /* One-row list mode: compact like an app list item rather than a tall card. */
  .products-grid.mobile-list-view{gap:9px}
  .products-grid.mobile-list-view .product-card{grid-template-columns:104px minmax(0,1fr)!important;min-height:116px!important}
  .products-grid.mobile-list-view .product-image-wrap{padding:6px!important}
  .products-grid.mobile-list-view .product-img{height:104px!important;min-height:104px!important;border-radius:12px!important}
  .products-grid.mobile-list-view .product-body{padding:10px 10px 9px 3px!important;justify-content:flex-start!important;min-height:0!important}
  .products-grid.mobile-list-view .product-body h3{font-size:13px!important;margin:1px 0 4px!important;line-height:1.3!important}
  .products-grid.mobile-list-view .price{font-size:16px!important;line-height:1.2!important}
  .products-grid.mobile-list-view .meta{gap:4px!important;margin:6px 0 0!important}
  .products-grid.mobile-list-view .badge{font-size:9.5px!important;padding:3px 6px!important}
  .products-grid.mobile-list-view .product-actions{margin-top:6px!important}
  .products-grid.mobile-list-view .product-actions .btn{min-height:30px!important;padding:5px 8px!important;font-size:10.5px!important}
  .products-grid.mobile-list-view .product-open-mark{width:20px;height:20px;font-size:11px}

  .xianyu-open-modal .modal-title-row{gap:12px!important;align-items:flex-start!important}
  .xianyu-open-modal .modal-x{flex-basis:38px!important}
}

/* v3.1 product marketing labels */
.product-image-wrap{position:relative}
.product-corner-badge{position:absolute;z-index:3;left:10px;top:10px;max-width:calc(100% - 20px);padding:5px 9px;border-radius:999px;font-size:11px;line-height:1;font-weight:800;letter-spacing:.02em;box-shadow:0 3px 10px rgba(73,49,38,.08);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.badge-style-hot{background:#fff0ed;color:#d45643}
.badge-style-new{background:#eaf7ef;color:#4f8e6d}
.badge-style-recommend{background:#fff2dc;color:#b77a2d}
.badge-style-limited{background:#f3ecf8;color:#80619b}
.product-promo{margin:3px 0 6px;color:#9b8275;font-size:12px;line-height:1.45;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
@media(max-width:620px){
 .product-corner-badge{left:7px;top:7px;padding:4px 7px;font-size:9px}
 .products-grid:not(.mobile-list-view) .product-promo{font-size:10px;line-height:1.35;margin:2px 0 5px;-webkit-line-clamp:2}
 .products-grid.mobile-list-view .product-promo{font-size:10px;line-height:1.35;margin:1px 0 4px;-webkit-line-clamp:1}
}


/* v3.29: subtitle emphasis + compact announcement bar; marquee only when text overflows */
.front-head p{font-size:15px!important;line-height:1.55;font-weight:500;margin-top:7px!important}
.front-notice{display:flex;align-items:center;gap:9px;max-width:100%;height:38px;box-sizing:border-box;margin:-4px 0 16px;padding:0 13px;border:1px solid #eadbd1;border-radius:12px;background:rgba(255,255,255,.58);color:#856f63;font-size:13px;line-height:1;overflow:hidden}
.front-notice-icon{flex:0 0 auto;color:#c98470;font-size:12px}
.front-notice-viewport{min-width:0;flex:1;overflow:hidden;white-space:nowrap}
.front-notice-text{display:inline-block;white-space:nowrap}
.front-notice.is-overflowing .front-notice-text{padding-right:28px;animation:frontNoticeMarquee 10s linear infinite alternate}
.front-notice.is-overflowing:hover .front-notice-text{animation-play-state:paused}
@keyframes frontNoticeMarquee{from{transform:translateX(0)}to{transform:translateX(calc(-1 * var(--notice-distance,0px)))}}
@media(max-width:620px){.front-head p{font-size:14px!important}.front-notice{height:36px;margin:-2px 0 13px;padding:0 11px;font-size:12px;border-radius:11px}}
@media(prefers-reduced-motion:reduce){.front-notice.is-overflowing .front-notice-text{animation:none;text-overflow:ellipsis;max-width:100%;overflow:hidden}}

/* v3.43: filtering must win over mobile card layout rules */
.product-card.front-filter-hidden{display:none!important}