* { box-sizing: border-box; }
body { margin: 0; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; background: #f5f5f5; color: #333; }
a { color: #e4393c; text-decoration: none; transition: color 0.2s; }
a:hover { color: #c81623; text-decoration: none; }
img { max-width: 100%; display: block; }
.site-header { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 1rem 2rem; background: #fff; color: #333; position: sticky; top: 0; z-index: 100; border-bottom: 1px solid #eee; box-shadow: 0 2px 10px rgba(0,0,0,0.05); }
.site-header a { color: #666; margin-right: 1.5rem; font-weight: 500; }
.site-header a:hover { color: #e4393c; }
.site-header h1 { margin: 0; font-size: 1.5rem; color: #e4393c; }
.site-header h1 a { color: #e4393c; margin: 0; font-weight: bold; font-style: italic; }
.site-header p { display: none; } /* 隐藏副标题让头部更简洁 */
.top-nav { display: flex; gap: 0.5rem; flex-wrap: wrap; align-items: center; }
.top-nav a { padding: 0.5rem 1rem; border-radius: 20px; transition: all 0.2s; }
.top-nav a:hover { background: #fff0f0; color: #e4393c; }
.container { max-width: 1280px; margin: 0 auto; padding: 1rem; }
.card, .subcard { background: #fff; border-radius: 12px; padding: 1.5rem; box-shadow: 0 4px 12px rgba(0,0,0,0.03); margin-bottom: 1.5rem; border: 1px solid #f0f0f0; transition: transform 0.2s, box-shadow 0.2s; }
.card:hover { box-shadow: 0 8px 24px rgba(0,0,0,0.08); transform: translateY(-2px); }
.hero { display: grid; gap: 1rem; }
.ecommerce-hero, .storefront-hero { background: linear-gradient(180deg, #ffffff, #f8fbff); }
.hero h2, .flow-card h2 { margin-top: 0; line-height: 1.45; }
.hero h2 span { color: #2563eb; }
.hero-actions { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1rem; }
.primary-tile { display: grid; gap: .5rem; background: linear-gradient(135deg, #ff6b6b, #e4393c); color: #fff; padding: 1.5rem; border-radius: 12px; box-shadow: 0 8px 20px rgba(228,57,60,.2); transition: all 0.3s; }
.primary-tile:hover { transform: translateY(-3px); box-shadow: 0 12px 25px rgba(228,57,60,.3); }
.primary-tile.secondary { background: linear-gradient(135deg, #ff9f43, #f368e0); box-shadow: 0 8px 20px rgba(243,104,224,.2); }
.primary-tile span { color: rgba(255,255,255,.92); font-size: .95rem; }
.grid.two { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 1rem; }
.form-grid, .stack, .address-list { display: grid; gap: .75rem; }
.inline-form, .button-row, .section-head, .sku-actions, .quick-links { display: flex; gap: .75rem; flex-wrap: wrap; align-items: center; justify-content: space-between; }
.quick-links { justify-content: flex-start; }
input[type=text], input[type=number], textarea, select { width: 100%; padding: .82rem .9rem; border: 1px solid #d7e0ea; border-radius: 12px; background: #fff; font-size: .98rem; }
label { color: #334155; font-size: .95rem; }
button, .button-link { display: inline-flex; align-items: center; justify-content: center; background: #e4393c; color: white; border: 0; border-radius: 8px; padding: 0.8rem 1.5rem; cursor: pointer; text-decoration: none; font-weight: 600; transition: all 0.2s; }
button:hover, .button-link:hover { text-decoration: none; opacity: .95; }
button[disabled], .button-link[disabled] { opacity: .55; cursor: not-allowed; }
.button-link.ghost, .secondary-btn { background: #0f766e; color: #fff; }
.button-link.subtle, .subtle-btn { background: #475569; color: #fff; }
.danger-btn { background: #dc2626; color: #fff; }
.small-btn { padding: .5rem .78rem; font-size: .9rem; }
pre { overflow: auto; background: #0f172a; color: #e2e8f0; padding: 1rem; border-radius: 8px; }
.warning { color: #b91c1c; }
.success { color: #047857; }
.inline { display: flex; align-items: center; gap: .5rem; }
.top-gap { margin-top: 1rem; }
code { background: #eef2ff; padding: .1rem .35rem; border-radius: 4px; color: #312e81; }
.eyebrow { margin: 0 0 .35rem; color: #2563eb; font-weight: 700; font-size: .9rem; }
.muted { color: #64748b; }
.small { font-size: .9rem; }
.accent-text { color: #1d4ed8; font-weight: 600; }
.clean-list, .result-list, .stats-grid, .bullet-list { list-style: none; padding: 0; margin: 0; }
.clean-list li, .result-list li { display: flex; justify-content: space-between; gap: 1rem; padding: .75rem 0; border-bottom: 1px solid #e5e7eb; }
.clean-list li:last-child, .result-list li:last-child { border-bottom: 0; }
.compact-list li { padding: .6rem 0; }
.stats-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: .75rem; }
.stats-grid li { background: #eff6ff; border-radius: 12px; padding: .9rem; display: grid; gap: .35rem; }
.stats-grid strong { font-size: 1.3rem; }
.stats-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 1rem; margin-bottom: 1rem; }
.stat-card { background: #fff; border: 1px solid #e5e7eb; border-radius: 16px; padding: 1rem; box-shadow: 0 6px 18px rgba(15,23,42,.05); display: grid; gap: .4rem; }
.stat-card span { color: #64748b; font-size: .92rem; }
.stat-card strong { font-size: 1.4rem; }
details summary { cursor: pointer; font-weight: 600; }
.api-grid { display: grid; gap: .5rem; }
.category-chip-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: .75rem; margin-top: 1rem; }
.compact-chip-grid { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }
.category-chip { display: grid; gap: .35rem; padding: .95rem; border: 1px solid #dbe3f0; border-radius: 14px; background: #f8fbff; color: #0f172a; }
.category-chip.active { border-color: #2563eb; box-shadow: inset 0 0 0 1px #2563eb; background: #eef4ff; }
.category-chip span, .category-chip em { color: #64748b; font-style: normal; font-size: .88rem; }
.product-list { display: grid; gap: .9rem; }
.compact-product-list { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.product-card, .order-card, .sku-card, .address-card, .sku-option-card { border: 1px solid #f0f0f0; border-radius: 12px; padding: 1rem; background: #fff; transition: all 0.2s; }
.product-card:hover { box-shadow: 0 4px 12px rgba(0,0,0,0.05); }
.product-card { display: grid; grid-template-columns: 120px 1fr; gap: 1rem; align-items: start; }
.product-card img, .focus-product img { width: 96px; height: 96px; object-fit: cover; border-radius: 12px; background: #f1f5f9; }
.product-card.mini { grid-template-columns: 72px 1fr; }
.product-card.mini img { width: 72px; height: 72px; }
.product-card.selected, .order-card.selected, .sku-card.recommended, .address-card.recommended, .highlight-card, .sku-option-card.active { border-color: #e4393c; box-shadow: inset 0 0 0 1px #e4393c; background: #fffcfc; }
.product-body { min-width: 0; }
.product-title { font-weight: 700; color: #0f172a; }
.price-tag { display: inline-flex; margin-top: .35rem; padding: .28rem .7rem; border-radius: 4px; background: #fff0f0; color: #e4393c; font-weight: 700; font-size: 1.1rem; }
.price-tag.large { font-size: 1rem; }
.prominent-price { font-size: 1.05rem; }
.focus-product { display: grid; grid-template-columns: 120px 1fr; gap: 1rem; align-items: start; }
.large-product img { width: 120px; height: 120px; }
.sku-grid { display: grid; gap: .75rem; }
.sku-form-inline { display: grid; grid-template-columns: 120px 1fr; gap: .5rem; align-items: center; }
.order-card-list { display: grid; gap: .9rem; }
.status-pill { display: inline-flex; padding: .25rem .65rem; border-radius: 999px; background: #ecfeff; color: #155e75; font-size: .88rem; font-weight: 700; }
.status-pill.warm { background: #fff7ed; color: #c2410c; }
.bullet-list { display: grid; gap: .55rem; }
.bullet-list li { display: grid; gap: .15rem; }
.bullet-list.compact { gap: .4rem; }
.checkbox-line { display: flex; align-items: center; gap: .5rem; color: #334155; }
.checkbox-line input { width: auto; }
.debug-details { opacity: .92; }
.cart-actions-grid .highlight-card { background: linear-gradient(180deg, #ffffff, #f7fbff); }
.storefront-grid { align-items: start; }
.storefront-sidebar { position: sticky; top: 92px; }
.search-result-list { max-height: 680px; overflow: auto; padding-right: .25rem; }
.storefront-main { display: grid; gap: 1rem; }
.product-detail-shell { background: linear-gradient(180deg, #ffffff, #fafcff); }
.product-detail-layout { display: grid; grid-template-columns: minmax(280px, 420px) minmax(0, 1fr); gap: 1.25rem; align-items: start; }
.product-main-media { background: #f8fafc; border-radius: 18px; padding: .6rem; border: 1px solid #e5e7eb; }
.product-main-media img { width: 100%; aspect-ratio: 1 / 1; object-fit: cover; border-radius: 14px; }
.product-thumb-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(72px, 1fr)); gap: .6rem; }
.product-thumb { border: 1px solid #e5e7eb; border-radius: 12px; padding: .2rem; background: #fff; }
.product-thumb img { width: 100%; aspect-ratio: 1 / 1; object-fit: cover; border-radius: 10px; }
.product-detail-title { margin: 0; line-height: 1.4; }
.mall-feature-strip { display: flex; gap: .6rem; flex-wrap: wrap; }
.mall-feature-strip span { display: inline-flex; align-items: center; padding: .45rem .7rem; border-radius: 999px; background: #f8fafc; border: 1px solid #e2e8f0; color: #334155; font-size: .9rem; }
.spec-guide { display: grid; gap: .7rem; padding: .9rem; border-radius: 16px; background: #f8fbff; border: 1px solid #e3ecfb; }
.selected-sku-banner { padding: .85rem 1rem; border-radius: 14px; background: linear-gradient(135deg, #eff6ff, #f8fbff); color: #1d4ed8; border: 1px solid #bfdbfe; font-weight: 600; }
.selected-sku-banner.mini { padding: .6rem .75rem; font-size: .92rem; }
.sku-picker { border-top: 1px solid #edf2f7; padding-top: 1rem; }
.sku-option-grid { display: grid; gap: .9rem; }
.sku-option-top { display: flex; justify-content: space-between; gap: .75rem; align-items: center; }
.price-line { display: flex; gap: .75rem; flex-wrap: wrap; align-items: center; }
.purchase-actions { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); align-items: stretch; }
.purchase-form-card { display: grid; gap: .6rem; padding: .9rem; background: #f8fafc; border-radius: 14px; border: 1px solid #e2e8f0; }
.detail-image-stack { display: grid; gap: .75rem; }
.detail-image-stack img { width: 100%; border-radius: 16px; border: 1px solid #e5e7eb; background: #fff; }
.empty-storefront-state { display: grid; gap: .6rem; min-height: 280px; place-content: center; text-align: center; border: 1px dashed #cbd5e1; border-radius: 18px; background: #fbfdff; }
.address-page-grid { align-items: start; }
.address-book-card, .address-form-card { min-height: 100%; }
.storefront-address-list { gap: .9rem; }
.storefront-address-card { background: linear-gradient(180deg, #ffffff, #fbfdff); }
.address-line { color: #0f172a; line-height: 1.7; }
.inline-action-form { display: flex; }
.storefront-form { gap: .95rem; }
.district-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .8rem; }
.address-helper-card { background: #fafcff; }
.order-status-source { color: #94a3b8; font-size: .82rem; }
@media (max-width: 960px) {
  .storefront-sidebar { position: static; }
  .product-detail-layout { grid-template-columns: 1fr; }
  .district-grid { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  .site-header { flex-direction: column; align-items: flex-start; }
  .stats-grid { grid-template-columns: 1fr; }
  .product-card, .focus-product, .sku-form-inline { grid-template-columns: 1fr; }
  .product-card img, .focus-product img, .large-product img { width: 100%; height: auto; max-height: 240px; }
  .purchase-actions { grid-template-columns: 1fr; }
}


.success.card { color: #047857; border: 1px solid #a7f3d0; background: #ecfdf5; }
.compact-search-form { justify-content: flex-start; }
.compact-search-form input[type=text] { flex: 1 1 240px; }


.primary-tile.dark { background: linear-gradient(135deg, #334155, #0f172a); }
.mall-home-hero .hero-actions { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.mall-entry-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; }
.cart-main-grid { align-items: start; }
.cart-sidebar-stack { display: grid; gap: 1rem; }
.cart-product-card { background: linear-gradient(180deg, #ffffff, #fbfdff); }
.cart-inline-meta { display: flex; flex-wrap: wrap; gap: .6rem; align-items: center; }


.purchase-guide-card { background: linear-gradient(180deg, #ffffff, #fbfdff); }
.purchase-guide-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: .8rem; }
.purchase-guide-grid article { display: grid; gap: .35rem; padding: .9rem; border-radius: 14px; background: #f8fbff; border: 1px solid #dbeafe; }
.detail-buy-highlight { background: linear-gradient(180deg, #fff, #f8fbff); }
.checkout-stage-card { background: linear-gradient(180deg, #ffffff, #f8fbff); }
.checkout-stage-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: .8rem; }
.stage-pill { display: grid; gap: .35rem; place-items: center; text-align: center; padding: 1rem; border-radius: 16px; border: 1px solid #dbe3f0; background: #fff; color: #64748b; }
.stage-pill strong { width: 36px; height: 36px; display: inline-grid; place-items: center; border-radius: 999px; background: #e2e8f0; color: #0f172a; }
.stage-pill.active { border-color: #2563eb; background: #eef4ff; color: #1d4ed8; box-shadow: inset 0 0 0 1px #2563eb; }
.stage-pill.active strong { background: #2563eb; color: #fff; }
.checkout-action-card { background: #fafcff; }
@media (max-width: 720px) {
  .container { padding: .75rem .75rem 6rem; }
  .card, .subcard { border-radius: 16px; padding: .9rem; }
  .hero-actions, .mall-entry-grid, .checkout-stage-grid, .purchase-guide-grid { grid-template-columns: 1fr; }
  .top-nav { width: 100%; }
  .top-nav a { margin-right: .5rem; }
  .search-result-list { max-height: none; }
  .section-head { align-items: flex-start; }
  .button-row, .inline-form, .quick-links { width: 100%; }
  .button-row > *, .inline-form > *, .quick-links > * { flex: 1 1 100%; }
  button, .button-link { width: 100%; }
}

.product-page-shell { background: linear-gradient(180deg, #ffffff, #fafdff); }

.mall-pdp-hero { background: linear-gradient(135deg, #ffffff, #f6f9ff); }
.mall-pdp-hero-top { display: flex; gap: 1rem; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; }
.mall-pdp-hero-actions { min-width: 240px; justify-content: flex-end; }
.mall-pdp-card { overflow: hidden; }
.mall-pdp-grid { display: grid; grid-template-columns: minmax(320px, 460px) minmax(0, 1fr); gap: 1.5rem; align-items: start; }
.mall-pdp-media-column { position: sticky; top: 94px; }
.mall-main-media { position: relative; background: radial-gradient(circle at top left, #ffffff, #eef5ff 58%, #fff6ef 100%); border: 1px solid #dbeafe; box-shadow: inset 0 0 0 1px rgba(255,255,255,.6), 0 18px 40px rgba(37,99,235,.08); }
.mall-main-media-badges { position: absolute; top: 1rem; left: 1rem; right: 1rem; display: flex; gap: .5rem; flex-wrap: wrap; z-index: 1; }
.media-badge { display: inline-flex; align-items: center; padding: .38rem .75rem; border-radius: 999px; background: rgba(255,255,255,.92); border: 1px solid rgba(191,219,254,.95); color: #1d4ed8; font-weight: 700; font-size: .84rem; box-shadow: 0 10px 24px rgba(15,23,42,.06); }
.media-badge.strong { background: linear-gradient(135deg, #eff6ff, #ffffff); }
.media-badge.muted-badge { color: #64748b; }
.thumb-button { border: 1px solid #dbe3f0; border-radius: 12px; background: #fff; padding: .2rem; cursor: pointer; }
.thumb-button.active { border-color: #2563eb; box-shadow: inset 0 0 0 1px #2563eb; }
.mall-pdp-info { display: grid; gap: 0; }
.mall-pdp-title-block { display: grid; gap: 0; }
.pdp-price-panel { display: grid; gap: .65rem; padding: 1.5rem; border-radius: 12px; background: #fafafa; border: 1px solid #f0f0f0; border-left: 4px solid #e4393c; box-shadow: 0 4px 12px rgba(0,0,0,0.03); }
.pdp-price-topline { display: flex; align-items: center; justify-content: space-between; gap: .75rem; flex-wrap: wrap; }
.price-kicker { color: #b45309; font-weight: 700; font-size: .92rem; }
.pdp-price-main { font-size: 2.5rem; line-height: 1.05; font-weight: bold; color: #e4393c; }
.pdp-price-sub { font-size: 1rem; }
.pdp-price-meta { font-size: .95rem; }
.pdp-price-meta-row { display: flex; justify-content: space-between; gap: .8rem; flex-wrap: wrap; align-items: center; }
.pdp-deliver-note { color: #0f766e; font-size: .88rem; font-weight: 600; }
.pdp-selection-summary { background: linear-gradient(180deg, #ffffff, #f8fbff); border: 1px solid #dbeafe; }
.compact-head { gap: .5rem; }
.compact-head h4 { margin: 0; }
.selection-mini-note { color: #64748b; font-size: .84rem; }
.spec-group-list { display: grid; gap: 1rem; }
.spec-group { display: grid; gap: .65rem; }
.spec-group-head { display: flex; justify-content: space-between; gap: .75rem; align-items: baseline; flex-wrap: wrap; }
.spec-group-title { color: #334155; font-weight: 700; }
.spec-group-hint { color: #94a3b8; font-size: .84rem; }
.spec-value-list { display: flex; flex-wrap: wrap; gap: .75rem; }
.spec-value-chip { border: 1px solid #cbd5e1; background: #fff; color: #0f172a; border-radius: 14px; padding: .75rem 1rem; font-weight: 600; cursor: pointer; min-width: 96px; }
.spec-value-chip.active { border-color: #e4393c; color: #e4393c; background: #fff0f0; box-shadow: inset 0 0 0 1px #e4393c; }
.spec-value-chip.disabled { opacity: .45; cursor: not-allowed; }
.mall-service-strip { display: flex; gap: .7rem; flex-wrap: wrap; }
.mall-service-strip span { display: inline-flex; align-items: center; padding: .52rem .8rem; border-radius: 999px; background: #f8fbff; border: 1px solid #dbeafe; color: #334155; font-size: .9rem; }
.mall-spec-section { border-top: 1px solid #edf2f7; padding-top: 1.1rem; }
.pdp-purchase-panel { display: grid; gap: 1rem; padding: 1rem; border-radius: 20px; background: #fff; border: 1px solid #e2e8f0; box-shadow: 0 10px 24px rgba(15,23,42,.05); }
.quantity-panel { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.quantity-label { font-weight: 700; color: #0f172a; }
.quantity-help { margin: .25rem 0 0; }
.quantity-stepper { display: inline-grid; grid-template-columns: 44px 92px 44px; align-items: center; border: 1px solid #cbd5e1; border-radius: 14px; overflow: hidden; background: #fff; }
.quantity-stepper input { border: 0; border-left: 1px solid #e2e8f0; border-right: 1px solid #e2e8f0; border-radius: 0; text-align: center; }
.qty-btn { height: 100%; background: #f8fafc; color: #0f172a; font-size: 1.2rem; }
.pdp-action-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .9rem; }
.pdp-buy-form, .sticky-buy-form { display: block; }
.ghost-action-btn, .buy-now-btn { width: 100%; min-height: 52px; border-radius: 14px; font-size: 1rem; font-weight: 700; }
.ghost-action-btn { background: #fffebf; color: #ff6b00; border: 1px solid #ffcc80; }
.ghost-action-btn:hover { background: #fffaaa; }
.buy-now-btn { background: linear-gradient(135deg, #f5515f, #e4393c); color: #fff; }
.mall-pdp-bottom { align-items: start; }
.mall-debug-panel { opacity: .72; }
.checkout-item-brief, .success-item-card { display: grid; grid-template-columns: 88px 1fr; gap: .9rem; align-items: start; }
.checkout-item-brief img, .success-item-card img { width: 88px; height: 88px; border-radius: 14px; object-fit: cover; background: #f8fafc; }
.checkout-item-title, .success-item-title { font-weight: 700; color: #0f172a; }
.checkout-inline-price { margin-top: .45rem; color: #dc2626; font-weight: 700; }
.success-hero-card { background: linear-gradient(135deg, #ffffff, #f0fdf4); }
.success-summary-card, .success-actions-card { min-height: 100%; }
.success-mark { width: 72px; height: 72px; border-radius: 999px; display: grid; place-items: center; background: linear-gradient(135deg, #10b981, #059669); color: #fff; font-size: 2rem; font-weight: 800; margin-bottom: 1rem; }
.success-action-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: .8rem; }
.success-tip-card { background: linear-gradient(180deg, #ffffff, #f8fbff); }
.spec-card-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(168px, 1fr)); gap: .9rem; }
.spec-card-grid.with-image { grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); }
.spec-card { display: grid; gap: .75rem; align-items: start; text-align: left; border: 1px solid #dbe3f0; border-radius: 18px; background: linear-gradient(180deg, #ffffff, #fbfdff); padding: .7rem; color: #0f172a; cursor: pointer; min-height: 100%; }
.spec-card.active { border-color: #2563eb; box-shadow: inset 0 0 0 1px #2563eb, 0 10px 24px rgba(37,99,235,.10); background: linear-gradient(180deg, #eef4ff, #ffffff); }
.spec-card.disabled { opacity: .5; cursor: not-allowed; }
.spec-card-media { display: block; width: 100%; }
.spec-card-media img { width: 100%; aspect-ratio: 1 / 1; object-fit: cover; border-radius: 14px; background: #f8fafc; }
.spec-card-body { display: grid; gap: .28rem; }
.spec-card-body strong { font-size: .98rem; line-height: 1.4; }
.spec-card-body em { font-style: normal; color: #dc2626; font-weight: 700; }
.spec-card-body small { color: #64748b; font-size: .84rem; }
.image-spec-stack { display: grid; gap: 1rem; }
.mall-spec-hero-stack { background: linear-gradient(180deg, #ffffff, #fbfdff); border: 1px solid #e7edf5; border-radius: 20px; padding: 1rem; }
.image-spec-group { display: grid; gap: .65rem; }
.image-spec-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(118px, 1fr)); gap: .75rem; }
.image-spec-card { display: grid; gap: .5rem; border: 1px solid #dbe3f0; border-radius: 18px; background: #fff; padding: .35rem; text-align: left; color: #0f172a; cursor: pointer; transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease; }
.image-spec-card:hover { transform: translateY(-2px); }
.image-spec-card.active { border-color: #2563eb; box-shadow: inset 0 0 0 1px #2563eb, 0 10px 24px rgba(37,99,235,.10); background: linear-gradient(180deg, #eef4ff, #ffffff); }
.image-spec-card.disabled { opacity: .45; cursor: not-allowed; }
.image-spec-media img { width: 100%; aspect-ratio: 1 / 1; object-fit: cover; border-radius: 14px; background: #f8fafc; }
.image-spec-meta { display: grid; gap: .2rem; padding: .1rem .2rem .25rem; }
.image-spec-meta strong { font-size: .92rem; line-height: 1.35; }
.image-spec-meta em { font-style: normal; color: #dc2626; font-weight: 700; font-size: .88rem; }
.image-spec-meta small { color: #64748b; font-size: .8rem; }
.mall-sticky-buybar { display: none; }
.mall-sticky-buybar-main { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .8rem; align-items: center; }
.mall-sticky-copy { min-width: 0; display: grid; gap: .15rem; }
.mall-sticky-price { color: #dc2626; font-size: 1.1rem; font-weight: 800; line-height: 1.1; }
.mall-sticky-summary { color: #0f172a; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mall-sticky-meta { display: flex; gap: .35rem; align-items: center; color: #64748b; font-size: .84rem; flex-wrap: wrap; }
.mall-sticky-actions { display: grid; grid-template-columns: repeat(2, minmax(88px, 1fr)); gap: .55rem; }
.sticky-ghost-btn, .sticky-buy-btn { min-height: 46px; border-radius: 14px; }
@media (max-width: 960px) {
  .mall-pdp-grid { grid-template-columns: 1fr; }
  .mall-pdp-media-column { position: static; }
}
@media (max-width: 720px) {
  .mall-pdp-hero-top { display: grid; gap: .25rem; }
  .mall-pdp-hero-actions { min-width: 0; justify-content: stretch; }
  .pdp-price-main { font-size: 1.8rem; }
  .pdp-price-meta-row { display: grid; gap: .35rem; }
  .quantity-panel { align-items: flex-start; flex-direction: column; }
  .pdp-action-row { grid-template-columns: 1fr; }
  .checkout-item-brief, .success-item-card { grid-template-columns: 1fr; }
  .spec-card-grid, .spec-card-grid.with-image { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .image-spec-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mall-feature-strip, .mall-service-strip { gap: .5rem; }
  .mall-feature-strip span, .mall-service-strip span { width: 100%; justify-content: center; }
  .mall-sticky-buybar {
    display: block;
    position: sticky;
    bottom: 0;
    z-index: 20;
    margin: 0 -.75rem;
    padding: .75rem;
    background: rgba(255,255,255,.95);
    backdrop-filter: blur(12px);
    border-top: 1px solid rgba(226,232,240,.95);
    box-shadow: 0 -12px 28px rgba(15,23,42,.10);
  }
  .mall-sticky-buybar-main { grid-template-columns: 1fr; }
  .mall-sticky-actions { grid-template-columns: 1fr 1fr; }
}


.debug-details summary a { color: #2563eb; text-decoration: none; }
.debug-details summary a:hover { text-decoration: underline; }
.order-card .muted.small { line-height: 1.6; }