/* Silascard 订单查询页的灰阶关系：#1d1d1f / #6b6d73 / #fbfbfd。
   这里只调整店面色彩；灰度层次由变量统一控制，尺寸、排版和交互沿用现有实现。 */
html:not(.dark):has(#app.sivan-storefront),
html:not(.dark) #app.sivan-storefront {
  --ui-bg-page:#fbfbfd;
  --ui-bg-elevated:#ffffff;
  --ui-bg-soft:#f7f8fa;
  --ui-bg-muted:#f0f0f3;
  --ui-bg-overlay:rgb(255 255 255 / 80%);
  --ui-bg-overlay-strong:rgb(255 255 255 / 95%);
  --ui-text-primary:#1d1d1f;
  --ui-text-secondary:#6b6d73;
  --ui-text-muted:#737680;
  --ui-text-on-accent:#ffffff;
  --ui-price-primary:#1d1d1f;
  --ui-border:#e7e8ed;
  --ui-border-strong:#d9dbe2;
  --ui-accent:#1d1d1f;
  --ui-accent-hover:#353539;
  --ui-accent-soft:#f0f0f3;
  --ui-info:#5d6068;
  --ui-info-soft:rgb(93 96 104 / 7%);
  --ui-focus-ring:rgb(29 29 31 / 18%);
  --ui-shadow-1:0 1px 3px rgb(29 29 31 / 3%);
  --ui-shadow-2:0 2px 8px rgb(29 29 31 / 4%);
  --ui-shadow-3:0 14px 40px -12px rgb(29 29 31 / 12%);
  --ui-shadow-soft:0 2px 8px rgb(29 29 31 / 3%);
  --ui-shadow-card:0 1px 3px rgb(29 29 31 / 3%),0 8px 26px -16px rgb(29 29 31 / 12%);
}

/* 夜间模式同样使用中性灰，避免切换后出现旧的深蓝底。 */
html.dark:has(#app.sivan-storefront),
html.dark #app.sivan-storefront {
  --ui-bg-page:#151517;
  --ui-bg-elevated:#1e1e21;
  --ui-bg-soft:#252528;
  --ui-bg-muted:#2c2c30;
  --ui-bg-overlay:rgb(30 30 33 / 82%);
  --ui-bg-overlay-strong:rgb(30 30 33 / 96%);
  --ui-text-primary:#f5f5f7;
  --ui-text-secondary:#b5b5bd;
  --ui-text-muted:#a2a2ad;
  --ui-text-on-accent:#1d1d1f;
  --ui-price-primary:#f5f5f7;
  --ui-border:#353539;
  --ui-border-strong:#515157;
  --ui-accent:#f5f5f7;
  --ui-accent-hover:#d9d9df;
  --ui-accent-soft:#2b2b30;
  --ui-info:#b5b5bd;
  --ui-info-soft:rgb(181 181 189 / 9%);
  --ui-focus-ring:rgb(245 245 247 / 24%);
  --ui-shadow-1:0 1px 3px rgb(0 0 0 / 16%);
  --ui-shadow-2:0 2px 8px rgb(0 0 0 / 20%);
  --ui-shadow-3:0 14px 40px -12px rgb(0 0 0 / 34%);
  --ui-shadow-soft:0 2px 8px rgb(0 0 0 / 16%);
  --ui-shadow-card:0 6px 24px -12px rgb(0 0 0 / 30%);
}

/* 将根变量也提供给传送到 body 的客服菜单、公告和确认弹窗。 */
html:has(#app.sivan-storefront),
html #app.sivan-storefront {
  --primary:var(--ui-accent);
  --primary-foreground:var(--ui-text-on-accent);
  --secondary:var(--ui-bg-soft);
  --secondary-foreground:var(--ui-text-primary);
  --background:var(--ui-bg-page);
  --foreground:var(--ui-text-primary);
  --card:var(--ui-bg-elevated);
  --card-foreground:var(--ui-text-primary);
  --muted:var(--ui-bg-soft);
  --muted-foreground:var(--ui-text-muted);
  --border:var(--ui-border);
  --input:var(--ui-border);
  --ring:var(--ui-accent);
}
html:has(#app.sivan-storefront) body,
html #app.sivan-storefront { background-color:var(--ui-bg-page); color:var(--ui-text-primary); }
html:has(#app.sivan-storefront) ::selection { background:var(--ui-bg-muted); color:var(--ui-text-primary); }

/* 商品大厅原来定义了局部绿灰变量，需要与根色板同步。 */
html #app.sivan-storefront .resource-hall {
  --ui-text-primary:#1d1d1f;
  --ui-text-secondary:#6b6d73;
  --ui-text-muted:#737680;
  --ui-accent:#1d1d1f;
  --ui-accent-soft:#f0f0f3;
  color:#1d1d1f;
}
html.dark #app.sivan-storefront .resource-hall {
  --ui-text-primary:#f5f5f7;
  --ui-text-secondary:#b5b5bd;
  --ui-text-muted:#a2a2ad;
  --ui-accent:#f5f5f7;
  --ui-accent-soft:#2b2b30;
  color:#f5f5f7;
}

/* 保留白色卡片与浅灰画布的轻微色差，不再使用蓝色描边或蓝色投影。 */
html #app.sivan-storefront :is(.resource-offer,.resource-support-service,.resource-card-skeleton) {
  border-color:var(--ui-border);
  background:var(--ui-bg-elevated);
  box-shadow:var(--ui-shadow-card);
}
html #app.sivan-storefront :is(.resource-offer:hover,.resource-offer:focus-visible,.resource-support-service:hover) {
  border-color:var(--ui-border-strong);
  box-shadow:0 3px 15px rgb(29 29 31 / 7%);
}
html #app.sivan-storefront .resource-offer-status {
  color:var(--ui-text-secondary);
  border-color:var(--ui-border-strong);
  background:var(--ui-bg-soft);
}
html #app.sivan-storefront :is(.resource-offer-price,.resource-offer-heading,.resource-offer--pro10 .resource-offer-multiplier,.resource-offer--pro25 .resource-offer-multiplier) { color:var(--ui-text-primary); }
html #app.sivan-storefront :is(.resource-offer--pro5 .resource-offer-multiplier,.resource-offer-price-unit,.resource-hall-count) { color:var(--ui-text-muted); }
html #app.sivan-storefront :is(.resource-filter-toggle,.resource-view-switch,.storefront-footer-chip) { background:var(--ui-bg-muted); color:var(--ui-text-secondary); }
html #app.sivan-storefront .resource-view-switch button.active { background:var(--ui-bg-elevated); color:var(--ui-text-primary); }
html #app.sivan-storefront .catalog-card-light::before { background:radial-gradient(320px circle at var(--spot-x,50%) var(--spot-y,50%),color-mix(in srgb,var(--ui-text-primary) 4%,transparent),transparent 70%); }
html #app.sivan-storefront .catalog-card-light::after { background:radial-gradient(180px circle at var(--spot-x,50%) var(--spot-y,50%),color-mix(in srgb,var(--ui-text-primary) 28%,transparent),transparent 72%); }
html #app.sivan-storefront .resource-mini-art { color:var(--ui-text-secondary); }

/* 商品插画保留原色；只有背景雪花使用中性灰，与店面色板协调。 */
html #app.sivan-storefront .pixel-snow-canvas { filter:grayscale(1); }
html #app.sivan-storefront .manga-spread {
  background:var(--ui-bg-elevated);
  border-color:var(--ui-border);
  box-shadow:var(--ui-shadow-card);
}
html #app.sivan-storefront .manga-copy h1 { color:var(--ui-text-primary); }
html #app.sivan-storefront .manga-tagline { color:var(--ui-text-secondary); }
html #app.sivan-storefront .manga-edge-light { background:radial-gradient(250px circle at var(--manga-mouse-x,50%) var(--manga-mouse-y,50%),#c9c9ce,transparent 78%); }
html.dark #app.sivan-storefront .manga-edge-light { background:radial-gradient(250px circle at var(--manga-mouse-x,50%) var(--manga-mouse-y,50%),#55555b,transparent 78%); }
html #app.sivan-storefront :is(.storefront-nav,.storefront-nav-drawer,.storefront-more-panel,.storefront-footer-info-panel) { border-color:var(--ui-border); background:var(--ui-bg-overlay-strong); color:var(--ui-text-primary); }
html #app.sivan-storefront .storefront-nav-link.is-active { background:var(--ui-bg-soft); color:var(--ui-text-primary); border-color:var(--ui-border); }
html #app.sivan-storefront :is(.storefront-register,.sivan-search-submit,.manga-primary svg) { background:var(--ui-accent); color:var(--ui-text-on-accent); }
html #app.sivan-storefront :is(.storefront-register:hover,.sivan-search-submit:hover,.manga-primary:hover svg) { background:var(--ui-accent-hover); }
html #app.sivan-storefront :is(.manga-primary,.demo-launcher) { border-color:var(--ui-border-strong); background:var(--ui-bg-elevated); color:var(--ui-text-primary); box-shadow:var(--ui-shadow-soft); }
html #app.sivan-storefront :is(.demo-play-icon,.demo-launcher-play) { background:var(--ui-accent); color:var(--ui-text-on-accent); }
html #app.sivan-storefront :is(.invitation-coupon-banner,.first-purchase-offer) { background:var(--ui-bg-soft); border-color:var(--ui-border); }

/* 客服面板自己的颜色变量不再沿用旧绿色。 */
html:has(#app.sivan-storefront) .sivan-support-menu {
  --support-bg:var(--ui-bg-elevated);
  --support-ink:var(--ui-text-primary);
  --support-muted:var(--ui-text-secondary);
  --support-line:var(--ui-border);
  --support-soft:var(--ui-bg-soft);
  box-shadow:var(--ui-shadow-3);
}
html:has(#app.sivan-storefront) :is(.sivan-support-trigger:hover,.sivan-support-trigger[data-state=open]) { background:var(--ui-bg-muted); }

/* 旧页面仍有蓝色/slate 工具类；集中映射信息色，不覆盖红色错误与绿色成功状态。 */
html:has(#app.sivan-storefront) :is(.text-blue-400,.text-blue-500,.text-blue-600,.text-blue-700,.text-blue-800,.text-sky-500,.text-sky-600,.text-cyan-600,.text-indigo-500,.text-indigo-600) { color:var(--ui-accent)!important; }
html:has(#app.sivan-storefront) :is(.text-slate-900,.text-gray-900,.text-gray-800,.text-slate-800) { color:var(--ui-text-primary)!important; }
html:has(#app.sivan-storefront) :is(.text-slate-700,.text-slate-600,.text-gray-600,.text-gray-700) { color:var(--ui-text-secondary)!important; }
html:has(#app.sivan-storefront) :is(.text-slate-500,.text-slate-400,.text-gray-500,.text-gray-400) { color:var(--ui-text-muted)!important; }
html:has(#app.sivan-storefront) :is(.bg-blue-500,.bg-blue-600,.bg-blue-700,.bg-blue-800,.bg-sky-500,.bg-indigo-600) { background-color:var(--ui-accent)!important; color:var(--ui-text-on-accent); }
html:has(#app.sivan-storefront) :is(.bg-blue-50,.bg-blue-100,.bg-sky-50,.bg-indigo-50,.bg-slate-50,.bg-slate-100,.bg-gray-50,.bg-gray-100) { background-color:var(--ui-bg-soft)!important; }
html:has(#app.sivan-storefront) :is(.border-blue-100,.border-blue-200,.border-blue-300,.border-sky-200,.border-slate-200,.border-gray-200) { border-color:var(--ui-border-strong)!important; }
html:has(#app.sivan-storefront) :is(.hover\:bg-blue-600,.hover\:bg-blue-700,.hover\:bg-blue-800):hover { background-color:var(--ui-accent-hover)!important; }
html:has(#app.sivan-storefront) :is(.focus\:border-blue-500,.focus\:border-blue-600):focus { border-color:var(--ui-accent)!important; }
html:has(#app.sivan-storefront) :is(.focus\:ring-blue-500,.focus-visible\:ring-blue-500,.ring-blue-500) { --tw-ring-color:var(--ui-focus-ring)!important; }
html:has(#app.sivan-storefront) .prose { --tw-prose-body:var(--ui-text-secondary); --tw-prose-headings:var(--ui-text-primary); --tw-prose-bold:var(--ui-text-primary); --tw-prose-links:var(--ui-accent); --tw-prose-counters:var(--ui-text-muted); }
html:has(#app.sivan-storefront) :is(input,textarea,select) { accent-color:var(--ui-accent); caret-color:var(--ui-text-primary); }
html:has(#app.sivan-storefront) :is(a,button,input,textarea,select,summary):focus-visible { outline-color:var(--ui-accent); }

/* 已发布的工具类中有编译后的固定色值，显式覆盖后懒加载详情页也能一致。 */
html:has(#app.sivan-storefront) :is(.text-primary,.theme-price-lg,.theme-price-sm) { color:var(--ui-text-primary)!important; }
html:has(#app.sivan-storefront) :is(.text-foreground,.text-card-foreground) { color:var(--ui-text-primary)!important; }
html:has(#app.sivan-storefront) .text-muted-foreground { color:var(--ui-text-muted)!important; }
html:has(#app.sivan-storefront) .bg-primary { background-color:var(--ui-accent)!important; color:var(--ui-text-on-accent); }
html:has(#app.sivan-storefront) .text-primary-foreground { color:var(--ui-text-on-accent)!important; }
html:has(#app.sivan-storefront) :is(.bg-primary\/5,.bg-primary\/10) { background-color:var(--ui-accent-soft)!important; }
html:has(#app.sivan-storefront) .border-primary\/40 { border-color:var(--ui-border-strong)!important; }
html:has(#app.sivan-storefront) .ring-primary\/30 { --tw-ring-color:var(--ui-focus-ring)!important; }
html:has(#app.sivan-storefront) .hover\:bg-primary\/90:hover { background-color:var(--ui-accent-hover)!important; }
html:has(#app.sivan-storefront) .sivan-skip-link { background:var(--ui-accent); color:var(--ui-text-on-accent); }
html:has(#app.sivan-storefront) :is(input,textarea)::placeholder { color:var(--ui-text-muted); }
html #app.sivan-storefront .radar-reading-note { color:var(--ui-text-secondary); border-color:var(--ui-border); }
html #app.sivan-storefront .price-formula b { color:var(--ui-text-primary); }
html #app.sivan-storefront .price-formula i { color:var(--ui-text-muted); }

/* 购买演示和雷达中的硬编码蓝色，也遵守同一套信息层级。 */
html:has(#app.sivan-storefront) .purchase-demo-overlay { background:rgb(29 29 31 / 46%); }
html:has(#app.sivan-storefront) .purchase-demo-dialog { box-shadow:0 24px 100px rgb(29 29 31 / 25%); }
html:has(#app.sivan-storefront) :is(.demo-screen-step,.demo-pointer) { color:var(--ui-text-primary); }
html:has(#app.sivan-storefront) .demo-screen-step>span { color:var(--ui-text-muted); }
html #app.sivan-storefront .reset-card { --reset-blue:var(--ui-accent); --reset-ink:var(--ui-text-primary); --reset-muted:var(--ui-text-muted); }
html #app.sivan-storefront .storefront-footer { color:var(--ui-text-secondary); background:transparent; }
html #app.sivan-storefront .storefront-footer-brand h3 { color:var(--ui-text-primary); }
html #app.sivan-storefront .storefront-footer-brand p { color:var(--ui-text-secondary); }
html #app.sivan-storefront .storefront-footer-chip:hover { color:var(--ui-text-primary); background:var(--ui-bg-soft); border-color:var(--ui-border-strong); }

/* 历史运行时补丁的颜色映射：保留规格勾选、焦点、购买与付款步骤的真实状态，只替换固定蓝色。 */
html:has(#app.sivan-storefront) .qq-group-icon[data-v-073d4206] { color:var(--ui-accent); }
html:has(#app.sivan-storefront) .qq-group-contact.is-compact[data-v-073d4206]:hover { color:var(--ui-accent); }
html:has(#app.sivan-storefront) .support-copy[data-v-b89e8687]:hover { color:var(--ui-accent); }
html:has(#app.sivan-storefront) .support-icon[data-v-b89e8687] { background:var(--ui-accent-soft); color:var(--ui-accent); }
html:has(#app.sivan-storefront) .sivan-skip-link { background:var(--ui-accent); }
html:has(#app.sivan-storefront) .sivan-skip-link:focus,
html:has(#app.sivan-storefront) .sivan-skip-link:focus-visible { outline:2px solid var(--ui-accent); }
html:has(#app.sivan-storefront) .sivan-skip-link:hover { background:var(--ui-accent-hover); }
html:has(#app.sivan-storefront) #app :is(a,button,input,select,textarea,[tabindex]:not([tabindex="-1"])):focus-visible { outline:2px solid var(--ui-accent)!important; }
html:has(#app.sivan-storefront) #app .product-detail-page .product-information>.mt-auto button.bg-primary { background-color:var(--ui-accent); }
html:has(#app.sivan-storefront) #app .product-detail-page .product-information>.mt-auto button.bg-primary:hover:not(:disabled) { background-color:var(--ui-accent-hover); }
html:has(#app.sivan-storefront) #app :is(.payment-page,.checkout-page) { --b2-ink:var(--ui-text-primary); --b2-ink2:var(--ui-text-secondary); --b2-line:var(--ui-border); }
html:has(#app.sivan-storefront) #app .payment-page>ol>li[class*="teal-strong"]>span:first-child { border-color:var(--ui-accent-soft); background:var(--ui-accent-soft); color:var(--ui-accent); }
html:has(#app.sivan-storefront) #app .payment-page>ol>li.text-primary { color:var(--ui-accent); }
html:has(#app.sivan-storefront) #app .payment-page>ol>li.text-primary>span:first-child { border-color:var(--ui-accent); background:var(--ui-accent); box-shadow:0 0 0 6px var(--ui-accent-soft); }
html:has(#app.sivan-storefront) #app .recharge-steps .active span { box-shadow:0 0 0 6px var(--ui-accent-soft)!important; background:var(--ui-accent)!important; border-color:var(--ui-accent)!important; }
html:has(#app.sivan-storefront) #app .recharge-steps .active { color:var(--ui-accent)!important; }
html:has(#app.sivan-storefront) #app .recharge-steps .done span { background:var(--ui-accent-soft)!important; border-color:var(--ui-accent-soft)!important; color:var(--ui-accent)!important; }
html:has(#app.sivan-storefront) #app .payment-page .rounded-2xl.bg-secondary>.border-t>div.mt-2,
html:has(#app.sivan-storefront) #app .payment-page section>div.mt-2\.5.text-xs.text-muted-foreground { background:var(--ui-accent-soft); }
html:has(#app.sivan-storefront) #app .payment-page .rounded-2xl.bg-secondary>.border-t>div.mt-2:before,
html:has(#app.sivan-storefront) #app .payment-page section>div.mt-2\.5.text-xs.text-muted-foreground:before { background:var(--ui-accent); }
html:has(#app.sivan-storefront) #app .payment-page .rounded-full[class*="teal-soft"] { background:var(--ui-accent-soft)!important; }
html:has(#app.sivan-storefront) #app :is(.payment-page,.checkout-page) button.bg-primary { background-color:var(--ui-accent); }
html:has(#app.sivan-storefront) #app :is(.payment-page,.checkout-page) button.bg-primary:hover:not(:disabled) { background-color:var(--ui-accent-hover); }
html:has(#app.sivan-storefront) #app :is(.payment-page,.checkout-page) :is(button,a).border-input:hover:not(:disabled) { border-color:var(--ui-accent); background:var(--ui-accent-soft); color:var(--ui-accent); }
html:has(#app.sivan-storefront) #app .payment-page button.text-left.border.rounded-xl:hover:not(:disabled),
html:has(#app.sivan-storefront) #app .checkout-page .checkout-channel:hover:not(:disabled) { border-color:var(--ui-accent); }
html:has(#app.sivan-storefront) #app .payment-page button.text-left.border.rounded-xl.bg-primary\/10,
html:has(#app.sivan-storefront) #app .checkout-page .checkout-channel[aria-pressed="true"] { border:2px solid var(--ui-accent)!important; background:var(--ui-accent-soft)!important; }
html:has(#app.sivan-storefront) #app .payment-page button.text-left.border.rounded-xl.bg-primary\/10:after,
html:has(#app.sivan-storefront) #app .checkout-page .checkout-channel[aria-pressed="true"]:after { background:var(--ui-accent); }
html:has(#app.sivan-storefront) #app :is(.payment-page,.checkout-page) :is(input:not([type=checkbox]):not([type=radio]),textarea,select):focus-visible { border-color:var(--ui-accent)!important; }
html:has(#app.sivan-storefront) #app :is(input:not([type=checkbox]):not([type=radio]):not([type=range]),textarea,select):focus-visible:not(.manga-hero *) { border-color:var(--ui-accent)!important; }
html:has(#app.sivan-storefront) #app .product-information .rounded-lg.border.overflow-hidden.w-fit:has(input:focus-visible) { border-color:var(--ui-accent); }
html:has(#app.sivan-storefront) #app .product-information>div:first-child>.border-b>.mb-3>span:first-child { color:var(--ui-text-secondary); }
html:has(#app.sivan-storefront) #app .product-information .theme-price-lg { color:var(--ui-text-primary)!important; }
html:has(#app.sivan-storefront) #app .product-information .theme-price-original { color:var(--ui-text-secondary); }
html:has(#app.sivan-storefront) #app .product-information .border-b>.space-y-2>p.text-sm.font-medium { background:var(--ui-accent-soft); color:var(--ui-accent)!important; }
html:has(#app.sivan-storefront) #app .product-information h2+.grid>button.rounded-xl:not(:disabled):hover { border-color:var(--ui-accent); }
html:has(#app.sivan-storefront) #app .product-information h2+.grid>button.rounded-xl.bg-primary\/10 { border:2px solid var(--ui-accent)!important; background:var(--ui-accent-soft)!important; color:var(--ui-text-primary); }
html:has(#app.sivan-storefront) #app .product-information h2+.grid>button.rounded-xl.bg-primary\/10:after { background:var(--ui-accent); }
html:has(#app.sivan-storefront) #app .product-detail-page .theme-prose ol>li:before { background:var(--ui-accent-soft); color:var(--ui-accent); }
html:has(#app.sivan-storefront) #app .product-detail-page .theme-prose ol>li:not(:last-child):after { background:var(--ui-border); }
html:has(#app.sivan-storefront) body .recharge-dialog .notice-highlight ul>li:before { background:var(--ui-accent); box-shadow:0 0 0 3px var(--ui-accent-soft); }
html:has(#app.sivan-storefront) body .recharge-dialog .notice-scroll>ol>li:before { background:var(--ui-accent-soft); color:var(--ui-accent); }
html:has(#app.sivan-storefront) body .recharge-dialog .notice-scroll>ol>li:not(:last-child):after { background:var(--ui-border); }
html:has(#app.sivan-storefront) #app .checkout-page .checkout-total .text-primary { color:var(--ui-text-primary); }
html:has(#app.sivan-storefront) #app .text-center.theme-slide-up.rounded-2xl.border.bg-card>p.font-medium.text-foreground { color:var(--ui-text-primary); }
html:has(#app.sivan-storefront) #app .payment-page>.border-dashed>p { color:var(--ui-text-primary); }