:root {
  --ink: #17264b;
  --muted: #657592;
  --indigo: #3658bf;
  --line: #dfe7f5;
  --paper: #f5f7fc;
}
body { background: radial-gradient(ellipse at 88% 0, #e3ebff80, transparent 45%), var(--paper); }
.shell { width: min(1360px, calc(100% - 64px)); }
.topbar { height: 30px; font-size: 10px; letter-spacing: .3px; }
.topbar button { font-size: 9px; color: #bcccec; }
.header { background: #ffffffed; }
.header-inner { height: 86px; }
.brand { font-size: 28px; letter-spacing: -.8px; }
.brand-shop { font-size: 12px; letter-spacing: 2px; }
.navigation a, .navigation button { font-size: 13px; padding: 12px 18px; border-radius: 10px; }
.header-actions .order-button { display: inline-flex; align-items: center; border: 1px solid #dce5f6; background: #fff; border-radius: 10px; padding: 11px 17px; color: #405b9b; font-size: 12px; }
.header-actions .order-button:hover { background: #eef3ff; border-color: #aebfe8; }
.store-layout { grid-template-columns: 248px minmax(0, 1fr); gap: 28px; padding-top: 30px; }
.sidebar { top: 24px; padding: 25px 13px 19px; border-radius: 18px; box-shadow: 0 8px 30px #223d7305; }
.sidebar-title { font-size: 14px; margin: 0 13px 24px; color: #627393; }
.sidebar-title small { font-size: 9px; }
.category-item { padding: 17px 13px; border-radius: 11px; min-height: 90px; gap: 11px; }
.category-item strong { font-size: 18px; font-weight: 650; line-height: 1.4; }
.category-item small { font-size: 12px; color: #6b7e9e; line-height: 1.65; word-break: keep-all; }
.category-symbol { color: #6c84c0; }
.category-item.active { background: linear-gradient(110deg, #e9f0ff, #f3f6ff); border-color: #d2def8; }
.category-item.active:after { display: none; }
.category-count { margin-left: auto; flex-shrink: 0; font-size: 12px; color: #768ab5; background: #fff9; border: 1px solid #e0e7f6; border-radius: 6px; padding: 3px 5px; min-width: 21px; text-align: center; }
.sidebar-domain { margin: 33px 14px 0; font-size: 8px; color: #8c9dbc; }
.store-banner:has(.banner-offers) { min-height: 304px; padding: 35px 40px; border-radius: 19px; background: radial-gradient(ellipse at 90% 25%, #4a79ec48, transparent 62%), linear-gradient(112deg, #11234c, #24458f); box-shadow: 0 12px 35px #1f3d8012; }
.store-banner:before { content: ""; position: absolute; inset: 0; background-image: linear-gradient(#b6caff05 1px, transparent 1px), linear-gradient(90deg, #b6caff05 1px, transparent 1px); background-size: 32px 32px; pointer-events: none; }
.store-banner .eyebrow { display: inline-flex; align-items: center; gap: 8px; padding: 6px 10px; border: 1px solid #a9c2ff38; border-radius: 25px; background: #b8cfff0b; color: #b8cdf5; font-size: 10px; letter-spacing: 1.7px; margin-bottom: 17px; }
.store-banner .eyebrow:before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: #94b4ff; box-shadow: 0 0 10px #8baaff7a; }
.banner-copy { max-width: 82%; }
.store-banner h1 { font-size: clamp(29px, 2.5vw, 42px); font-weight: 650; line-height: 1.4; letter-spacing: -.4px; margin-bottom: 13px; color: #f5f8ff; }
.banner-description { font-size: 13px; line-height: 1.8; color: #c0d0ec; max-width: none; }
.banner-offers { gap: 9px; margin-top: 21px; }
.banner-offers>span { font-size: 11px; padding: 8px 11px; border-radius: 8px; background: #aec7ff0d; border-color: #bad0ff32; }
.banner-offers strong { font-size: 19px; font-variant-numeric: tabular-nums; }
.banner-actions { display: flex; align-items: center; gap: 14px; margin-top: 22px; }
.banner-shop { margin-top: 0; font-size: 12px; padding: 13px 18px; border-radius: 9px; gap: 30px; background: #fff; box-shadow: 0 5px 16px #07173624; }
.banner-secondary { background: transparent; color: #cfddf8; font-size: 12px; border: 1px solid #bbd0ff42; padding: 12px 16px; border-radius: 9px; }
.banner-secondary:hover { background: #e6eeff12; color: #fff; }
.banner-art { width: 400px; height: 270px; right: -44px; top: 23px; opacity: .7; }
.banner-corner { font-size: 7px; right: 26px; bottom: 20px; }
.notice { margin-top: 17px; padding: 14px 17px; gap: 13px; border-radius: 11px; border-color: #e2e9f5; }
.notice-tag { font-size: 10px; padding: 5px 8px; border-radius: 5px; color: #4f6aa4; background: #edf3ff; }
.notice p { font-size: 11px; line-height: 1.8; }
.catalog { padding-top: 38px; }
.catalog-heading { align-items: center; gap: 22px; }
.catalog-heading .eyebrow { font-size: 9px; letter-spacing: 2px; color: #93a1ba; margin-bottom: 9px; }
.catalog-heading h2 { font-size: 26px; font-weight: 650; letter-spacing: -.5px; gap: 12px; }
.catalog-heading h2>span { font-size: 10px; font-weight: 500; padding: 5px 8px; color: #6b81b0; border: 1px solid #e0e7f6; background: #fff; border-radius: 6px; }
.search { width: 285px; padding: 13px 14px; border-radius: 10px; border-color: #dfe7f5; box-shadow: 0 3px 10px #2d427104; }
.search input { font-size: 12px; }
.search svg { width: 16px; height: 16px; color: #8699be; }
.search kbd { font-size: 10px; }
.catalog-subheading { margin-top: 17px; margin-bottom: 24px; }
.catalog-subheading>p { font-size: 12px; line-height: 1.8; }
.sort-label, .sort-label select { font-size: 11px; color: #6b7e9e; }
.product-grid { gap: 20px; }
.product-card { border-color: #dce5f6; border-radius: 16px; box-shadow: 0 5px 18px #2a457209; transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.product-card:hover, .product-card:focus-within { border-color: #91ace4; box-shadow: 0 14px 32px #264a9214; transform: translateY(-4px); }
.card-cover { height: 152px; background: radial-gradient(ellipse at 20% 12%, #ecf3ffb0, transparent 70%), linear-gradient(135deg, #dce7ff, #e8effd); border-bottom: 1px solid #dce6fa; }
.card-cover:before { width: 254px; height: 100px; top: calc(50% - 50px); left: calc(50% - 127px); border-color: #4774d63d; }
.card-cover:after { width: 212px; height: 78px; top: calc(50% - 39px); left: calc(50% - 106px); border-color: #6188df30; }
.cover-label { font-size: 6px; color: #7992c2; left: 17px; bottom: 14px; letter-spacing: 1.2px; }
.cover-index { font-size: 8px; right: 17px; top: 15px; color: #8ca1c8; }
.gpt-brand-art { width: 94px; height: 108px; border-radius: 24px; box-shadow: 0 7px 20px #375a9d12, inset 0 1px 0 #fff; border-color: #d3e0fa; }
.gpt-tier-label { font-size: 7px; letter-spacing: .8px; }
.card-body { padding: 21px; }
.card-meta { margin-bottom: 14px; align-items: center; }
.card-category { font-size: 10px; color: #8a9ab5; }
.status { font-size: 9px; padding: 5px 7px; }
.product-card h3 { font-size: 17px; font-weight: 650; line-height: 1.55; color: #203863; margin-bottom: 10px; letter-spacing: -.2px; }
.card-description { font-size: 12px; line-height: 1.9; min-height: 69px; color: #687a98; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.card-bottom { margin-top: 20px; padding-top: 18px; border-color: #e7edf7; align-items: center; gap: 9px; }
.card-price { font-size: 24px; font-weight: 650; color: #294d9d; letter-spacing: -.5px; line-height: 1.35; font-variant-numeric: tabular-nums; }
.card-price small { font-size: 10px; font-weight: 450; color: #8597b5; letter-spacing: 0; }
.card-button { padding: 10px 11px; font-size: 11px; font-weight: 550; border-radius: 8px; gap: 9px; border: 1px solid #dce7fb; background: #f0f5ff; white-space: nowrap; }
.card-button:hover { color: #fff; background: #3b5cc1; border-color: #3b5cc1; }
.store-assistance { margin-top: 31px; padding: 24px; border-radius: 14px; background: #fbfcff; border-color: #e0e8f6; }
.store-assistance h2 { font-size: 14px; line-height: 1.8; }
.store-assistance p, .store-assistance>button { font-size: 11px; }
.footer { margin-top: 32px; padding-top: 27px; }
.footer-brand { font-size: 22px; }.footer>div>p, .footer-links button { font-size: 10px; }.copyright { font-size: 9px; line-height: 1.8; }
dialog { border-radius: 19px; border-color: #dae4f7; box-shadow: 0 30px 120px #0c265a35; }
dialog h2 { font-size: 27px; font-weight: 650; letter-spacing: -.5px; }
dialog p:not(.eyebrow) { font-size: 13px; line-height: 1.9; color: #637697; }
.dialog-close { min-width: 36px; min-height: 36px; font-size: 24px; }
.detail-cover { height: 164px; background: linear-gradient(135deg, #e0eaff, #edf3ff); }
.detail-content { padding: 28px; }.detail-content h2 { font-size: 27px; }.detail-content dt, .detail-content dd { font-size: 12px; line-height: 1.8; }
.detail-top { font-size: 12px; }.detail-notice { padding: 16px; border-radius: 10px; }.detail-notice strong { font-size: 12px; }.detail-notice p { font-size: 12px!important; }
.detail-footer strong { font-size: 27px; font-weight: 650; }.detail-footer small { font-size: 11px; }.detail-footer .button { font-size: 13px; padding: 13px 19px; border-radius: 9px; }
.commerce-label { font-size: 13px; }.commerce-label input { padding: 13px; border-radius: 9px; font-size: 15px; }.commerce-dialog .button { font-size: 13px; padding: 12px 18px; border-radius: 9px; }
.email-lookup-form>.button { width: 100%; }.lookup-intro { margin-bottom: 23px; }.text-button { background: transparent; color: #4567af; font-size: 12px; padding: 8px 0; text-align: left; }
.lookup-credential { display: block; margin-top: 20px; border-top: 1px solid #e1e9f8; padding-top: 17px; width: 100%; }
.email-order-results { margin-top: 21px; }.lookup-count { font-size: 12px!important; }.lookup-empty { border: 1px dashed #d7e2f6; border-radius: 10px; padding: 20px; background: #f7faff; }
.email-order-card { border: 1px solid #dce6f8; background: #fbfcff; border-radius: 12px; padding: 18px; margin-top: 13px; }.email-order-heading { display: flex; align-items: center; gap: 12px; justify-content: space-between; }.email-order-heading strong { font-size: 14px; line-height: 1.6; }.email-order-card small { color: #8899b6; font-size: 11px; }.email-order-card .commerce-actions { margin-top: 14px; align-items: center; }.lookup-pagination { display: flex; gap: 14px; align-items: center; justify-content: center; margin-top: 18px; font-size: 12px; }.lookup-pagination button { border: 1px solid #dce5f6; padding: 9px 12px; border-radius: 7px; background: #fff; }.lookup-pagination button:disabled { opacity: .4; cursor: default; }
@media(max-width:1150px) {
  .shell { width: calc(100% - 44px); }.store-layout { grid-template-columns: 224px minmax(0,1fr); gap: 22px; }.category-item { padding: 13px 9px; gap: 8px; }.category-item strong { font-size: 16px; }.category-item small { font-size: 11px; }.category-count { font-size: 12px; }.category-symbol { width: 21px; }.sidebar-title { margin-inline: 9px; }.sidebar-title small { font-size: 8px; }
  .store-banner:has(.banner-offers) { padding: 30px; min-height: 295px; }.product-grid { gap: 15px; }.card-body { padding: 17px; }.card-price { font-size: 22px; }.card-button { font-size: 10px; padding: 9px; }.product-card h3 { font-size: 16px; }.navigation a,.navigation button { padding: 10px 12px; font-size: 12px; }
}
@media(max-width:900px) {
  .brand { font-size: 25px; }.navigation { display: none; }.product-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }.banner-art { opacity: .35; right: -112px; }.banner-copy { max-width: 100%; }.search { width: 220px; }.catalog-heading h2 { font-size: 24px; }.catalog-subheading>p { font-size: 11px; }.card-bottom { align-items: flex-start; flex-direction: column; }.card-button { align-self: stretch; text-align: center; display: flex; justify-content: space-between; }
}
@media(max-width:720px) {
  .shell { width: calc(100% - 32px); }.topbar { height: 27px; font-size: 8px; }.topbar button { font-size: 7px; }.header-inner { height: 74px; }.brand { font-size: 25px; }.brand-shop { font-size: 11px; }.header-actions .order-button { padding: 9px 12px; font-size: 11px; border-radius: 8px; }
  .store-layout { display: flex; flex-direction: column; gap: 18px; padding-top: 19px; }.sidebar { position: static; padding: 0; width: 100%; background: transparent; border: 0; box-shadow: none; }.sidebar-title,.sidebar-domain { display: none; }#categories { flex-direction: row; overflow-x: auto; scrollbar-width: none; gap: 8px; padding-bottom: 4px; }.category-item { min-height: 48px; padding: 9px 13px; flex-shrink: 0; border: 1px solid #dce6f8; background: #fff; border-radius: 9px; gap: 7px; }.category-item strong { font-size: 16px; margin: 0; }.category-item small { display: none; }.category-symbol { width: 18px; height: 18px; }.category-symbol svg { width: 17px; height: 17px; }.category-count { font-size: 12px; padding: 2px 4px; min-width: 18px; margin-left: 3px; }.category-item.active { background: #3658b6; border-color: #3658b6; color: #fff; }.category-item.active .category-symbol { color: #e0eaff; }.category-item.active .category-count { color: #e4edff; background: #ffffff14; border-color: #ffffff30; }
  .store-main { width: 100%; }.store-banner:has(.banner-offers) { border-radius: 15px; padding: 27px 25px; min-height: 286px; }.store-banner .eyebrow { font-size: 8px; letter-spacing: 1.2px; padding: 5px 8px; margin-bottom: 17px; }.store-banner h1 { font-size: 30px; line-height: 1.45; letter-spacing: -.3px; }.banner-description { font-size: 11px; line-height: 1.8; max-width: 270px; }.banner-art { width: 300px; top: 12px; right: -150px; opacity: .23; }.banner-offers { margin-top: 18px; gap: 7px; max-width: 100%; }.banner-offers>span { padding: 7px 9px; font-size: 9px; gap: 5px; }.banner-offers strong { font-size: 16px; }.banner-actions { margin-top: 19px; gap: 10px; flex-wrap: wrap; }.banner-shop { padding: 11px 14px; font-size: 11px; gap: 22px; }.banner-secondary { padding: 10px 12px; font-size: 11px; }.banner-corner { display: none; }
  .notice { margin-top: 13px; padding: 12px; gap: 9px; }.notice-tag { font-size: 8px; padding: 5px 6px; flex-shrink: 0; }.notice p { font-size: 10px; }.catalog { padding-top: 28px; }.catalog-heading { gap: 13px; align-items: center; }.catalog-heading .eyebrow { font-size: 7px; letter-spacing: 1px; margin-bottom: 8px; }.catalog-heading h2 { font-size: 22px; gap: 8px; }.catalog-heading h2>span { font-size: 8px; padding: 4px 6px; }.search { width: 166px; padding: 11px; gap: 6px; border-radius: 8px; }.search input { font-size: 10px; }.search svg { width: 13px; height: 13px; }.search kbd { display: none; }.catalog-subheading { margin-top: 14px; margin-bottom: 20px; gap: 12px; }.catalog-subheading>p { font-size: 10px; max-width: 220px; }.sort-label { font-size: 0; }.sort-label select { font-size: 10px; max-width: 110px; }
  .product-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }.product-card { border-radius: 13px; }.card-cover { height: 124px; }.card-cover:before { width: 195px; height: 78px; top: calc(50% - 39px); left: calc(50% - 98px); }.card-cover:after { width: 165px; height: 59px; top: calc(50% - 30px); left: calc(50% - 83px); }.cover-label { font-size: 4px; left: 10px; bottom: 10px; }.cover-index { font-size: 6px; right: 11px; top: 11px; }.gpt-brand-art { width: 76px; height: 92px; border-radius: 19px; gap: 5px; }.gpt-brand-art img { width: 55px; height: 55px; }.gpt-tier-label { font-size: 6px; }.cover-icon.product-artwork svg { width: 73px; height: 73px; }.card-body { padding: 14px; }.card-meta { margin-bottom: 12px; gap: 5px; }.card-category { font-size: 8px; }.status { font-size: 7px; padding: 4px 5px; }.product-card h3 { font-size: 15px; line-height: 1.6; margin-bottom: 9px; }.card-description { font-size: 11px; line-height: 1.85; min-height: 62px; }.card-bottom { flex-direction: column; align-items: stretch; padding-top: 14px; margin-top: 15px; gap: 12px; }.card-price { font-size: 23px; }.card-price small { font-size: 9px; display: inline; margin-left: 3px; }.card-button { align-self: stretch; font-size: 11px; padding: 10px; display: flex; justify-content: space-between; }
  .store-assistance { margin-top: 24px; padding: 18px; gap: 12px; }.store-assistance h2 { font-size: 13px; }.store-assistance p { font-size: 10px; }.store-assistance>button { font-size: 10px; }.footer { gap: 18px; }.footer-brand { font-size: 21px; }.footer>div>p,.footer-links button { font-size: 9px; }.copyright { font-size: 8px; }
  dialog { padding: 28px 23px; border-radius: 16px; }.detail-content { padding: 24px; }.detail-content h2,dialog h2 { font-size: 25px; }.detail-footer strong { font-size: 25px; }.detail-footer .button { font-size: 12px; padding: 12px 16px; }.detail-content dt,.detail-content dd { font-size: 11px; }.email-order-card { padding: 15px; }.email-order-heading { align-items: flex-start; }.email-order-heading strong { font-size: 13px; }.commerce-dialog .button { font-size: 12px; }
}
@media(max-width:379px) {
  .catalog-heading { align-items: stretch; flex-direction: column; gap: 15px; }.search { width: 100%; }.product-grid { grid-template-columns: 1fr; }.card-cover { height: 143px; }.card-body { padding: 20px; }.product-card h3 { font-size: 18px; }.card-description { min-height: 0; font-size: 12px; }.card-bottom { flex-direction: row; align-items: center; }.card-button { align-self: auto; font-size: 12px; gap: 16px; }.category-item { padding: 9px 10px; }.brand { font-size: 23px; }.brand-shop { font-size: 10px; }.header-actions .order-button { padding: 8px 10px; font-size: 10px; }
}
@media(prefers-reduced-motion:reduce) { .product-card { transition: none; }.product-card:hover,.product-card:focus-within { transform: none; } }

/* Product covers use a single brand mark and a readable plan hierarchy. */
.branded-cover {
  background: radial-gradient(ellipse at 100% 10%, #c7d8ff80, transparent 68%), linear-gradient(115deg, #f5f8ff, #e8efff);
  border-bottom-color: #dfe7f8;
}
.branded-cover:before, .branded-cover:after { display: none; }
.branded-cover .cover-label, .branded-cover .cover-index, .branded-cover .detail-cover-label { display: none; }
.branded-cover .cover-icon, .branded-cover #detail-icon { display: block; width: 100%; height: 100%; }
.brand-product-art { display: flex; align-items: center; justify-content: space-between; gap: 20px; width: 100%; height: 100%; padding: 25px 27px; }
.brand-art-copy { display: flex; flex-direction: column; align-items: flex-start; position: relative; }
.brand-art-kicker { color: #667eaf; font-size: 11px; font-weight: 500; letter-spacing: .3px; line-height: 1.4; }
.brand-art-plan { display: block; color: #263f83; font-size: 32px; font-weight: 650; letter-spacing: -1px; line-height: 1.35; margin: 1px 0 7px; }
.brand-art-variant { color: #5873a8; font-size: 11px; font-weight: 500; letter-spacing: .5px; line-height: 1.6; }
.brand-product-art img { display: block; width: 63px; height: 63px; object-fit: contain; flex-shrink: 0; opacity: .95; }
.detail-cover.branded-cover .brand-product-art { padding: 25px 40px; }
.detail-cover.branded-cover .brand-art-kicker { font-size: 12px; }
.detail-cover.branded-cover .brand-art-plan { font-size: 39px; }
.detail-cover.branded-cover .brand-art-variant { font-size: 13px; }
.detail-cover.branded-cover img { width: 79px; height: 79px; }
@media(max-width:1150px) and (min-width:901px) {
  .card-cover.branded-cover .brand-product-art { padding: 23px 19px; gap: 12px; }
  .card-cover.branded-cover img { width: 51px; height: 51px; }
}
@media(max-width:720px) {
  .card-cover.branded-cover .brand-product-art { padding: 18px 14px; gap: 8px; }
  .card-cover.branded-cover .brand-art-kicker { font-size: 9px; }
  .card-cover.branded-cover .brand-art-plan { font-size: 25px; margin-bottom: 5px; }
  .card-cover.branded-cover .brand-art-variant { font-size: 10px; letter-spacing: 0; }
  .card-cover.branded-cover img { width: 39px; height: 39px; }
  .detail-cover.branded-cover .brand-product-art { padding: 24px 30px; }
}
@media(max-width:379px) {
  .card-cover.branded-cover .brand-product-art { padding: 23px 27px; gap: 20px; }
  .card-cover.branded-cover .brand-art-kicker { font-size: 11px; }
  .card-cover.branded-cover .brand-art-plan { font-size: 32px; }
  .card-cover.branded-cover .brand-art-variant { font-size: 12px; }
  .card-cover.branded-cover img { width: 60px; height: 60px; }
}

.residential-art .brand-art-plan { font-size: 25px; letter-spacing: -.6px; white-space: nowrap; }
.detail-cover .residential-art .brand-art-plan { font-size: 35px; }
@media(max-width:720px) {
  .card-cover .residential-art .brand-art-plan { font-size: 17px; line-height: 1.8; }
  .card-cover .residential-art .brand-art-kicker { font-size: 8px; }
}
@media(max-width:379px) {
  .card-cover .residential-art .brand-art-plan { font-size: 25px; line-height: 1.35; }
  .card-cover .residential-art .brand-art-kicker { font-size: 11px; }
}

.banner-brand-logo { display: inline-block; width: 1.08em; height: 1.08em; margin-right: .25em; vertical-align: -.19em; object-fit: contain; filter: brightness(0) invert(1); }
.banner-brand { white-space: nowrap; }
.store-banner:has(.banner-support) { display: grid; grid-template-columns: minmax(0, 1fr) 196px; align-items: center; gap: 32px; }
.store-banner:has(.banner-support) .banner-copy { max-width: none; min-width: 0; }
.banner-support { position: relative; z-index: 1; padding: 15px 14px 13px; border: 1px solid #ffffffb3; border-radius: 17px; background: #f7faff; box-shadow: 0 16px 35px #071b4c35; text-align: center; color: #243e78; }
.banner-support-title { display: flex; align-items: center; justify-content: center; gap: 7px; margin: 0 0 10px; font-size: 14px; font-weight: 650; letter-spacing: .5px; }
.banner-support-title svg { width: 18px; height: 18px; fill: none; stroke: #4568bd; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.banner-support-qr { display: block; padding: 0; border: 1px solid #e0e8f8; border-radius: 10px; background: white; overflow: hidden; }
.banner-support-qr:focus-visible { outline: 3px solid #90b4ff; outline-offset: 3px; }
.banner-qr-window { display: block; position: relative; width: 100%; aspect-ratio: 1; overflow: hidden; }
.banner-qr-window img { position: absolute; display: block; width: 125.42373%; max-width: none; height: auto; left: -12.71186%; top: -36.44068%; }
.banner-support .banner-support-id { margin: 10px 0 3px; color: #294c95; font-size: 14px; line-height: 1.5; font-weight: 650; letter-spacing: .5px; user-select: all; }
.banner-support .banner-support-hint { margin: 0; color: #7182a2; font-size: 10px; line-height: 1.6; }
@media (min-width:721px) and (max-width:1050px) {
  .store-banner:has(.banner-support) { grid-template-columns: minmax(0, 1fr) 170px; gap: 20px; }
  .banner-support { padding: 13px 12px 11px; }
}
@media (max-width:720px) {
  .store-banner:has(.banner-support) { grid-template-columns: minmax(0, 1fr); gap: 23px; }
  .banner-support { display: grid; grid-template-columns: 128px minmax(0, 1fr); grid-template-rows: auto auto auto; column-gap: 14px; padding: 13px; border-radius: 13px; text-align: left; }
  .banner-support-qr { grid-column: 1; grid-row: 1 / 4; align-self: center; }
  .banner-support-title { grid-column: 2; align-self: end; justify-content: flex-start; margin: 0 0 7px; font-size: 13px; letter-spacing: 0; gap: 5px; }
  .banner-support-title svg { width: 16px; height: 16px; flex-shrink: 0; }
  .banner-support .banner-support-id { grid-column: 2; align-self: center; margin: 0 0 5px; font-size: 14px; }
  .banner-support .banner-support-hint { grid-column: 2; align-self: start; font-size: 10px; }
}
.category-brand-icon::before { content: ""; display: block; width: 24px; height: 24px; background: currentColor; mask-repeat: no-repeat; mask-position: center; mask-size: contain; }
.category-brand-gpt::before { mask-image: url("/assets/openai-blossom.svg?v=store-16"); }
.category-brand-claude::before { mask-image: url("/assets/claude-mark.svg?v=store-16"); }
@media(max-width:720px) { .category-brand-icon::before { width: 19px; height: 19px; } }

.customer-service-button { position: fixed; z-index: 20; right: 24px; bottom: 28px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; width: 58px; height: 70px; border: 1px solid #829ef933; border-radius: 16px; color: #fff; background: linear-gradient(145deg, #4569cf, #263f8e); box-shadow: 0 8px 25px #1e3c7930; font-size: 11px; letter-spacing: 1px; }
.customer-service-button svg { width: 25px; height: 25px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.customer-service-button:hover { background: #284dba; box-shadow: 0 10px 28px #254ca43d; }
.customer-service-dialog { width: min(390px, calc(100% - 32px)); max-height: 90dvh; overflow-y: auto; padding: 30px; text-align: center; background: #fff; }
.customer-service-dialog .eyebrow { margin-bottom: 10px; color: #8a9ab5; font-size: 9px; letter-spacing: 1.8px; }
.customer-service-dialog h2 { font-size: 25px; margin-bottom: 9px; }
.customer-service-dialog .customer-service-description { font-size: 12px; line-height: 1.8; margin: 0 0 16px; }
.customer-wechat-qr { display: block; width: min(100%, 270px); height: auto; margin: 0 auto 15px; border: 1px solid #e7edf8; border-radius: 12px; }
.customer-wechat-id { display: flex; justify-content: center; align-items: center; gap: 12px; margin: 0 0 15px; font-size: 12px!important; }
.customer-wechat-id strong { color: #294d9d; font-size: 17px; font-weight: 650; letter-spacing: .3px; user-select: all; }
.customer-service-dialog .customer-copy { display: block; width: 100%; border-radius: 9px; font-size: 13px; padding: 12px 16px; }
.customer-service-dialog .customer-service-status { font-size: 11px; margin: 8px 0 0; color: #5170aa; }
.customer-service-status:empty { display: none; }
.customer-qr-original { display: inline-block; margin-top: 13px; font-size: 11px; color: #7288b2; }
@media(max-width:720px) {
  .customer-service-button { right: 14px; bottom: calc(18px + env(safe-area-inset-bottom)); width: 50px; height: 61px; border-radius: 14px; font-size: 10px; gap: 4px; }
  .customer-service-button svg { width: 23px; height: 23px; }
  .customer-service-dialog { padding: 28px 24px; }
  .customer-wechat-qr { width: min(100%, 250px); }
}
