/* xique.fun commerce, shop.xique.fun navigation, CDK and cashier.
   Shared visual tokens follow the navigation homepage, with native controls retained. */
html[data-xique-site], html[data-xique-site] body {
  --xq-bg:#f5f6f8; --xq-surface:#fff; --xq-muted:#f0f2f5;
  --xq-ink:#20252d; --xq-secondary:#59616e; --xq-subtle:#6e7784;
  --xq-border:#e2e5e9; --xq-accent:#c0563a; --xq-hover:#ab4932;
  --xq-soft:#c0563a18;
}
html.dark[data-xique-site], html.dark[data-xique-site] body {
  --xq-bg:#16191e; --xq-surface:#1f232a; --xq-muted:#292f38;
  --xq-ink:#f0f2f5; --xq-secondary:#c0c6cf; --xq-subtle:#a2acba;
  --xq-border:#363e48; --xq-accent:#d9744f; --xq-hover:#e0805f;
  --xq-soft:#d9744f20;
  color-scheme:dark;
}
/* Commerce follows the CDK terracotta skin, rather than the older grey override. */
html[data-xique-site="commerce"], html[data-xique-site="commerce"] body {
  --xq-bg:#f2ede4; --xq-surface:#fbf8f1; --xq-muted:#f4eee3;
  --xq-ink:#2a2622; --xq-secondary:#5f5649; --xq-subtle:#756957;
  --xq-border:#e7ddcb; --xq-hover:#cb6a4f; --xq-soft:rgba(192,86,58,.1);
}
html.dark[data-xique-site="commerce"], html.dark[data-xique-site="commerce"] body {
  --xq-bg:#17120e; --xq-surface:#221a14; --xq-muted:#2b2118;
  --xq-ink:#f1e8db; --xq-secondary:#d0c3b1; --xq-subtle:#b6a793;
  --xq-border:#372c21; --xq-hover:#e0805f; --xq-soft:rgba(217,116,79,.14);
}
html[data-xique-site], html[data-xique-site] body {
  --font-body:Inter,"Noto Sans SC","PingFang SC","Microsoft YaHei",sans-serif;
  --font-sans:var(--font-body) !important; --font-head:var(--font-body) !important;
  --title-font:var(--font-body) !important; --dot-font:var(--font-body) !important;
  --font-display:var(--font-body) !important;
  --bg:var(--xq-bg) !important; --surface:var(--xq-surface) !important;
  --surface-solid:var(--xq-surface) !important; --surface-2:var(--xq-muted) !important;
  --ink:var(--xq-ink) !important; --ink-2:var(--xq-secondary) !important; --ink-3:var(--xq-subtle) !important;
  --brd:var(--xq-border) !important; --brd-2:var(--xq-border) !important;
  --primary:var(--xq-accent) !important; --primary-hover:var(--xq-hover) !important;
  --primary-soft:var(--xq-soft) !important; --primary-on:#fff !important;
  --card-bg:var(--xq-surface) !important; --card-border:1px solid var(--xq-border) !important;
  --card-radius:12px !important; --radius-card:12px !important; --card-shadow:none !important;
  --shadow:none !important; --shadow-sm:none !important; --shadow-card:none !important;
  --btn-radius:7px !important; --btn-img:none !important; --btn-shadow:none !important; --btn-shadow-hover:none !important;
  --input-radius:7px !important; --input-bg:var(--xq-surface) !important; --input-border:var(--xq-border) !important;
  --input-focus-border:var(--xq-accent) !important; --input-focus-bg:var(--xq-surface) !important;
  --bg-tint:none !important; --glow:none !important;
  --ui-bg-page:var(--xq-bg) !important; --ui-bg-surface:var(--xq-surface) !important;
  --ui-bg-elevated:var(--xq-surface) !important; --ui-bg-muted:var(--xq-muted) !important;
  --ui-bg-soft:var(--xq-muted) !important;
  --ui-text-primary:var(--xq-ink) !important; --ui-text-secondary:var(--xq-secondary) !important; --ui-text-muted:var(--xq-subtle) !important;
  --ui-border:var(--xq-border) !important; --ui-border-strong:var(--xq-border) !important;
  --ui-accent:var(--xq-accent) !important; --ui-accent-hover:var(--xq-hover) !important;
  --ui-accent-soft:var(--xq-soft) !important; --ui-price-primary:var(--xq-ink) !important;
  --ui-focus-ring:var(--xq-soft) !important;
  --ui-shadow-1:none !important; --ui-shadow-2:none !important; --ui-shadow-3:none !important; --ui-shadow-card:none !important;
  --background:var(--xq-bg) !important; --foreground:var(--xq-ink) !important;
  --border:var(--xq-border) !important; --muted:var(--xq-secondary) !important;
  --el-bg-color:var(--xq-surface) !important; --el-bg-color-page:var(--xq-bg) !important;
  --el-bg-color-overlay:var(--xq-surface) !important; --el-fill-color-blank:var(--xq-surface) !important;
  --el-text-color-primary:var(--xq-ink) !important; --el-text-color-regular:var(--xq-secondary) !important;
  --el-text-color-secondary:var(--xq-subtle) !important; --el-border-color:var(--xq-border) !important;
  --el-border-color-light:var(--xq-border) !important; --el-border-color-lighter:var(--xq-border) !important;
  --el-color-primary:var(--xq-accent) !important; --el-font-family:var(--font-body) !important;
  background:var(--xq-bg) !important; color:var(--xq-ink);
  font-family:var(--font-body) !important;
}
html[data-xique-site] :is(h1,h2,h3) { font-family:var(--font-body); letter-spacing:-.025em; }
html[data-xique-site] :is(button,input,textarea,select) { font-family:inherit; }
html[data-xique-site] :is(a,button,input,textarea,select):focus-visible { outline:2px solid var(--xq-accent); outline-offset:3px; }
/* Storefront shell applies on every customer route, independently of catalog layout. */
html[data-xique-site="commerce"] nav[data-v-2fa6c5a7] { position:relative !important; top:auto; padding:0 !important; background:var(--xq-surface); box-shadow:none !important; backdrop-filter:none; border-color:var(--xq-border); }
html[data-xique-site="commerce"] nav[data-v-2fa6c5a7] > .container { min-height:80px; }
html[data-xique-site="commerce"] .container { max-width:1200px; padding-inline:28px; }
html[data-xique-site="commerce"] .theme-wordmark { padding:0; border:0; border-radius:0; background:transparent; box-shadow:none; }
html[data-xique-site="commerce"] .theme-wordmark img { width:36px; height:36px; max-width:36px; animation:none; }
html[data-xique-site="commerce"] .theme-wordmark-text { font-size:16px; font-weight:650; }
html[data-xique-site="commerce"] main > :is(.product-detail-page,.pt-24) { padding-top:28px !important; }
html[data-xique-site="commerce"] main .bg-card,
html[data-xique-site="commerce"] [role="dialog"] { background:var(--xq-surface); border-color:var(--xq-border); border-radius:12px !important; box-shadow:none !important; }
html[data-xique-site="commerce"] .product-detail-page h1 { font-size:clamp(24px,2.4vw,32px); font-weight:650; }
html[data-xique-site="commerce"] main :is(button,a).bg-primary { border-radius:7px; box-shadow:none; }
html[data-xique-site="commerce"] main :is(input,textarea,select) { border-color:var(--xq-border); }
html[data-xique-site="commerce"] footer { background:var(--xq-surface); border-color:var(--xq-border); }
html[data-xique-site="commerce"] footer > .container { padding-block:28px; }
html[data-xique-site="commerce"] footer :is(p,li) { font-size:12px; }
html[data-xique-site="commerce"] footer a.bg-gray-50 { background:var(--xq-muted) !important; color:var(--xq-ink) !important; }
html[data-xique-site="commerce"] main .bg-card:has(button[aria-label="快速购买"]) { border-radius:12px !important; background:var(--xq-surface) !important; border-color:var(--xq-border) !important; }
html[data-xique-site="commerce"] main .bg-card:has(button[aria-label="快速购买"]) :is(p,.theme-price-sm) { color:var(--xq-secondary); }
html[data-xique-site="commerce"] main .bg-card:has(button[aria-label="快速购买"]) .theme-price-sm { color:var(--xq-ink); font-family:var(--font-body); }
/* Featured prices use the same theme accent as CDK actions in both modes. */
html[data-xique-site="commerce"] #featured .bg-card:has(button[aria-label="快速购买"]) .theme-price-sm { color:var(--xq-accent); }
html[data-xique-site="commerce"] main .bg-card:has(button[aria-label="快速购买"]) div.rounded-md.border,
html[data-xique-site="commerce"] main .bg-card:has(button[aria-label="快速购买"]) > div:first-child > .absolute:not(.inset-0) { display:none !important; }
/* Navigation guide shares shell geometry without adopting the homepage hero grid. */
html[data-xique-site="navigation"] body:not(.home-page) .site-header { padding:0; background:var(--xq-surface); border-bottom:1px solid var(--xq-border); }
html[data-xique-site="navigation"] body:not(.home-page) .header-inner { min-height:80px; }
html[data-xique-site="navigation"] body:not(.home-page) .shell { max-width:1200px; padding-inline:28px; }
html[data-xique-site="navigation"] body:not(.home-page) .brand-logo { animation:none; }
html[data-xique-site="navigation"] body:not(.home-page) .brand-name { font-size:16px; }
html[data-xique-site="navigation"] body:not(.home-page) .hero { padding:38px 0 24px; text-align:left; }
html[data-xique-site="navigation"] body:not(.home-page) .hero h1 { font-size:32px; }
html[data-xique-site="navigation"] body:not(.home-page) .eyebrow { display:none; }
html[data-xique-site="navigation"] .pill, html[data-xique-site="navigation"] .theme-toggle { border-radius:7px; box-shadow:none; }
/* CDK variables cover forms, progress, tables and teleported dialogs. */
html[data-xique-site="cdk"] .u-topbar { background:var(--xq-surface); border-bottom:1px solid var(--xq-border); min-height:80px; }
html[data-xique-site="cdk"] .u-main { max-width:1200px; }
html[data-xique-site="cdk"] .u-title { font-size:clamp(24px,2.65vw,36px); font-weight:650; }
html[data-xique-site="cdk"] .card { border-radius:12px; box-shadow:none; background:var(--xq-surface); }
html[data-xique-site="cdk"] .lucky-footer { background:var(--xq-surface); border-top:1px solid var(--xq-border); }
html[data-xique-site="pay"] :is(.rounded-xl,.rounded-2xl) { border-radius:12px; box-shadow:none; }
html[data-xique-site="pay"] .bg-white { background:var(--xq-surface); }
@media(max-width:1023px) {
  html[data-xique-site="commerce"] .container { padding-inline:24px; }
  html[data-xique-site="commerce"] nav[data-v-2fa6c5a7] > .container { min-height:68px; }
}
@media(max-width:640px) {
  html[data-xique-site="commerce"] .container,
  html[data-xique-site="navigation"] body:not(.home-page) .shell { padding-inline:18px; }
  html[data-xique-site="commerce"] nav[data-v-2fa6c5a7] > .container,
  html[data-xique-site="navigation"] body:not(.home-page) .header-inner,
  html[data-xique-site="cdk"] .u-topbar { min-height:66px; }
  html[data-xique-site="commerce"] .theme-wordmark-text,
  html[data-xique-site="navigation"] body:not(.home-page) .brand-name { font-size:13px; }
  html[data-xique-site="commerce"] .theme-wordmark img { width:28px; height:28px; }
  html[data-xique-site="navigation"] body:not(.home-page) .hero h1 { font-size:26px; }
}
@media(prefers-reduced-motion:reduce) {
  html[data-xique-site] *,html[data-xique-site] *::before,html[data-xique-site] *::after { animation:none !important; transition:none !important; }
}
/* Framework important declarations live in cascade layers; match that layer. */
@layer properties {
  html[data-xique-site="commerce"] main .bg-card,
  html[data-xique-site="commerce"] [role="dialog"] {
    border-radius:12px !important;
    box-shadow:none !important;
    background:var(--xq-surface) !important;
    border-color:var(--xq-border) !important;
  }
  html[data-xique-site="commerce"] .product-detail-page h1 {
    font-size:clamp(24px,2.4vw,32px) !important;
    font-weight:650 !important;
  }
  html[data-xique-site="commerce"] .theme-wordmark {
    background:transparent !important; border:0 !important; padding:0 !important; box-shadow:none !important;
  }
  html[data-xique-site="commerce"] footer a.bg-gray-50 { background:var(--xq-muted) !important; color:var(--xq-ink) !important; }
}