/* =========================================================
   788 赞助中心 · 玻璃拟态（Glassmorphism）视觉层
   ---------------------------------------------------------
   本文件在 style.css / catalog.css 之后加载，只替换视觉表现：
   1. 半透明玻璃面 + 毛玻璃模糊 + 1px 高光边框 + 柔和投影
   2. 玻璃面不透明度 70%~88%，模糊半径 8~18px（符合规范区间）
   3. backdrop-filter 带 -webkit- 前缀，并用 @supports 做不模糊降级
   4. 大面积列表卡片不启用模糊（性能优先），只保留半透明 + 高光边框
   5. hover / active / focus 均有独立玻璃反馈
   6. 响应式沿用原断点，仅调整玻璃面透明度与间距
   所有 HTML 结构、JS 逻辑、页面布局保持不变。
   ========================================================= */

/* ---------- 1. 设计令牌 ---------- */
:root{
  --ink:#241d24;
  --muted:#6a626a;
  --paper:#f4eef0;
  --paper-2:#efe7ec;
  --line:#e2d8de;
  --line-strong:rgba(255,255,255,.72);

  /* 玻璃面：白玻璃 / 深玻璃 */
  --glass-1:linear-gradient(140deg,rgba(255,255,255,.88),rgba(255,255,255,.68));
  --glass-2:linear-gradient(140deg,rgba(255,255,255,.78),rgba(255,255,255,.56));
  --glass-3:linear-gradient(140deg,rgba(255,255,255,.66),rgba(255,255,255,.44));
  --glass-dark:linear-gradient(140deg,rgba(40,32,40,.82),rgba(40,32,40,.66));

  /* 玻璃边框：顶部高光 + 边缘细线 */
  --glass-edge:rgba(255,255,255,.75);
  --glass-edge-soft:rgba(255,255,255,.45);
  --glass-dark-edge:rgba(255,255,255,.18);

  /* 柔和投影（取代涂鸦硬阴影） */
  --shadow:0 18px 44px -22px rgba(36,29,36,.42),0 2px 8px rgba(36,29,36,.06);
  --shadow-soft:0 10px 28px -18px rgba(36,29,36,.34),0 1px 4px rgba(36,29,36,.05);
  --shadow-hover:0 26px 56px -26px rgba(36,29,36,.5),0 4px 14px rgba(36,29,36,.08);
  --shadow-inset:inset 0 1px 0 rgba(255,255,255,.85);

  /* 圆角令牌：覆盖涂鸦手绘圆角，全站统一 */
  --r-lg1:22px;
  --r-lg2:20px;
  --r-lg3:18px;
  --r-sm1:12px;
  --r-sm2:14px;
  --r-sm3:16px;

  --blur:16px;
  --blur-sm:10px;
  --r-card:22px;
}

/* ---------- 2. 背景：彩色光斑网格（玻璃需要色彩托底） ---------- */
body{
  background:#f7eff3;
  color:var(--ink);
}
body::before{
  content:"";position:fixed;inset:0;z-index:0;pointer-events:none;opacity:1;
  background-image:
    radial-gradient(58% 48% at 10% 6%,rgba(242,41,127,.5),transparent 62%),
    radial-gradient(48% 44% at 92% 10%,rgba(63,182,242,.42),transparent 66%),
    radial-gradient(52% 46% at 80% 86%,rgba(255,210,63,.4),transparent 64%),
    radial-gradient(56% 50% at 16% 92%,rgba(242,41,127,.3),transparent 62%),
    linear-gradient(158deg,#fdf7f2 0%,#f8edf3 42%,#eef3fb 100%);
  background-size:auto;
  background-position:0 0;
  mask-image:none;
  -webkit-mask-image:none;
}
/* 丝线背景层：降低存在感，避免玻璃面下过于花 */
.waves-bg{opacity:.5}

/* 焦点环只作用于可交互元素，避免弹窗容器被整体描边 */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
summary:focus-visible,
[tabindex]:not([tabindex="-1"]):focus-visible{
  outline:2px solid var(--pink);outline-offset:3px;border-radius:6px;
}
dialog:focus,dialog:focus-visible,.pay-sheet:focus,.pay-sheet:focus-visible,.g-dialog:focus{outline:none}

/* ---------- 3. 通用按钮 ---------- */
button,
.g-btn{
  position:relative;
  border:1px solid var(--glass-edge);
  border-radius:var(--r-sm1);
  background:var(--glass-2);
  color:var(--ink);
  box-shadow:var(--shadow-soft);
  font-weight:600;
  -webkit-backdrop-filter:blur(var(--blur-sm)) saturate(1.4);
  backdrop-filter:blur(var(--blur-sm)) saturate(1.4);
  transition:background .2s ease,border-color .2s ease,box-shadow .2s ease,transform .2s ease;
}
button:hover:not(:disabled),
.g-btn:hover{
  background:var(--glass-1);
  border-color:rgba(255,255,255,.95);
  box-shadow:var(--shadow);
  transform:translateY(-2px);
}
button:active:not(:disabled),
.g-btn:active{
  transform:translateY(0) scale(.985);
  box-shadow:0 4px 12px -6px rgba(36,29,36,.3),var(--shadow-inset);
}
button:disabled{cursor:not-allowed;opacity:.5;box-shadow:none;transform:none}

/* 主按钮：粉色玻璃 */
.primary,.pink,.head-cta,.g-cta,.g-btn.is-dark,.g-btn.is-pink{
  background:linear-gradient(140deg,rgba(242,41,127,.92),rgba(242,41,127,.72));
  color:#fff;
  border:1px solid rgba(255,255,255,.55);
  box-shadow:0 12px 30px -14px rgba(242,41,127,.75),inset 0 1px 0 rgba(255,255,255,.5);
}
.primary:hover:not(:disabled),
.pink:hover:not(:disabled),
.head-cta:hover:not(:disabled),
.g-cta:hover,
.g-btn.is-dark:hover,
.g-btn.is-pink:hover{
  background:linear-gradient(140deg,rgba(250,58,143,.96),rgba(242,41,127,.82));
  border-color:rgba(255,255,255,.8);
  box-shadow:0 18px 38px -16px rgba(242,41,127,.85),inset 0 1px 0 rgba(255,255,255,.6);
  transform:translateY(-2px);
}
.primary:active:not(:disabled),.pink:active:not(:disabled){box-shadow:0 6px 16px -10px rgba(242,41,127,.7)}

.ghost{background:rgba(255,255,255,.35);border-color:var(--glass-edge-soft)}
.danger{color:var(--warn)}

/* ---------- 4. 表单控件 ---------- */
input,textarea,select{
  border:1px solid var(--glass-edge-soft);
  border-radius:var(--r-sm2);
  background:rgba(255,255,255,.68);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7);
  transition:border-color .2s,box-shadow .2s,background .2s;
}
input::placeholder,textarea::placeholder{color:#a8a0a8}
input:focus,textarea:focus,select:focus{
  border-color:rgba(242,41,127,.6);
  background:rgba(255,255,255,.86);
  box-shadow:0 0 0 3px rgba(242,41,127,.16),inset 0 1px 0 rgba(255,255,255,.9);
  outline:none;transform:none;
}
input[readonly]{background:rgba(255,255,255,.42);color:#4d454d;box-shadow:none}
input[readonly]:focus{border-color:var(--glass-edge-soft);box-shadow:none}

/* ---------- 5. 顶栏 + 导航 ---------- */
.topbar{
  background:var(--glass-dark);
  color:rgba(255,255,255,.82);
  border-bottom:1px solid rgba(255,255,255,.12);
  -webkit-backdrop-filter:blur(var(--blur-sm)) saturate(1.2);
  backdrop-filter:blur(var(--blur-sm)) saturate(1.2);
}
.topbar .dot{background:var(--pink);box-shadow:0 0 0 3px rgba(242,41,127,.25)}

.site-head,.g-head{
  background:linear-gradient(180deg,rgba(255,255,255,.78),rgba(255,255,255,.62));
  border-bottom:1px solid var(--glass-edge-soft);
  box-shadow:0 1px 0 rgba(255,255,255,.6),0 12px 32px -26px rgba(36,29,36,.5);
  -webkit-backdrop-filter:blur(var(--blur)) saturate(1.5);
  backdrop-filter:blur(var(--blur)) saturate(1.5);
}
.brand-mark{
  border:1px solid var(--glass-edge);
  border-radius:var(--r-sm1);
  background:rgba(255,255,255,.55);
  transform:none;
  box-shadow:var(--shadow-soft);
}
.brand-mark::after{display:none}
.brand-mark.is-logo{background:rgba(255,255,255,.6)}
.brand-mark.is-logo img{border-radius:inherit}

.nav a,.g-nav a{
  border:1px solid transparent;
  border-radius:var(--r-sm3);
  color:#4d454d;
  font-weight:600;
  transition:background .2s,border-color .2s,color .2s;
}
.nav a:hover,.g-nav a:hover{
  background:rgba(255,255,255,.62);
  border-color:var(--glass-edge);
  color:var(--ink);
  transform:none;
  box-shadow:var(--shadow-inset);
}
.g-brand img{
  border:1px solid var(--glass-edge);
  border-radius:var(--r-sm1);
  transform:none;
  box-shadow:var(--shadow-soft);
}
.g-brand b,.brand-text b{color:var(--ink)}

/* ---------- 6. HERO ---------- */
.hero,.g-hero{isolation:isolate}
.hero::after,.g-hero::after{
  background:radial-gradient(closest-side,rgba(242,41,127,.18),transparent 72%);
  filter:blur(8px);
}
.hero h1,.g-hero h1{
  color:#1f1a20;
  text-shadow:0 2px 18px rgba(255,255,255,.55);
}
/* 标题高亮：改为柔和粉色玻璃荧光，不再用笔触色块 */
.hero h1 em,.g-hero h1 em{text-shadow:0 8px 26px rgba(242,41,127,.28)}
.hero h1 em::after,.g-hero h1 em::after{
  left:-2px;right:-2px;bottom:.1em;height:.22em;
  background:linear-gradient(90deg,rgba(242,41,127,.42),rgba(255,210,63,.35));
  opacity:1;border-radius:6px;transform:none;filter:blur(.5px);
}
.hero h1 em::before,.g-hero h1 em::before{display:none}

.hero-lead,.g-lead{color:#57505a}
.hero-note{color:#6a626a}

/* 凭证卡：主玻璃面板（启用模糊） */
.pass,.g-pass{
  background:var(--glass-1);
  border:1px solid var(--glass-edge);
  border-radius:var(--r-card);
  box-shadow:var(--shadow),var(--shadow-inset);
  transform:none;
  -webkit-backdrop-filter:blur(var(--blur)) saturate(1.6);
  backdrop-filter:blur(var(--blur)) saturate(1.6);
}
.pass:hover,.g-pass:hover{transform:translateY(-4px);box-shadow:var(--shadow-hover),var(--shadow-inset)}
.pass::before{
  inset:0;border:0;border-radius:inherit;opacity:1;
  background:linear-gradient(180deg,rgba(255,255,255,.5),transparent 42%);
  pointer-events:none;
}
.pass-tape,.g-pass-tape{display:none}

.pass-kicker,.pass-stub small,.pass-sub,.g-pass-sub{color:#6a626a}
.pass-seal,.g-pass-logo img{
  border:1px solid var(--glass-edge);
  border-radius:var(--r-sm1);
  transform:none;
  background:rgba(255,255,255,.7);
  box-shadow:var(--shadow-soft);
}
.pass-amount b,.g-strip b{
  color:var(--pink);
  text-shadow:0 8px 24px rgba(242,41,127,.35);
}
.pass-rows,.pass-stub,.g-pass-rows{
  border-top:1px solid rgba(36,29,36,.1);
}
.g-pass-rows{padding-top:14px}
.barcode,.g-pass-code{
  opacity:.42;
  filter:blur(.2px);
  border-radius:2px;
}
.pass-row span,.g-pass-rows div{color:#6a626a}

/* ---------- 7. 步骤条 ---------- */
.steps{
  background:var(--glass-2);
  border-top:1px solid var(--glass-edge);
  border-bottom:1px solid var(--glass-edge);
  box-shadow:0 10px 30px -24px rgba(36,29,36,.4);
  -webkit-backdrop-filter:blur(var(--blur)) saturate(1.4);
  backdrop-filter:blur(var(--blur)) saturate(1.4);
}
.step{border-right:1px solid rgba(36,29,36,.08)}
.step-num,.step:nth-child(even) .step-num{
  border:1px solid rgba(255,255,255,.8);
  border-radius:10px;
  background:linear-gradient(140deg,rgba(242,41,127,.16),rgba(255,210,63,.16));
  color:var(--pink-deep);
  transform:none;
  box-shadow:none;
}
.step p{color:#6a626a}

/* ---------- 8. 区块标题 ---------- */
.section-head h2,.g-fleet-head h2{
  color:#1f1a20;
  text-shadow:0 3px 16px rgba(255,255,255,.6);
}
.section-head p,.g-fleet-head p{color:#6a626a}
.section-index b,.g-stamp{color:var(--pink-deep)}

/* 印章：改为玻璃胶囊标签 */
.g-stamp{
  background:rgba(255,255,255,.55);
  border:1px solid rgba(242,41,127,.35);
  border-radius:999px;
  transform:none;
  box-shadow:var(--shadow-soft);
  -webkit-backdrop-filter:blur(var(--blur-sm));
  backdrop-filter:blur(var(--blur-sm));
}

/* ---------- 9. 导航下拉 + 搜索 ---------- */
.nav-menu,.search-results{
  background:var(--glass-1);
  border:1px solid var(--glass-edge);
  border-radius:var(--r-sm3);
  box-shadow:var(--shadow);
  -webkit-backdrop-filter:blur(var(--blur)) saturate(1.6);
  backdrop-filter:blur(var(--blur)) saturate(1.6);
}
.nav-menu a,.search-hit{border-radius:10px;color:#4d454d}
.nav-menu a:hover,.search-hit:hover{background:rgba(242,41,127,.12);color:var(--ink)}
.search-results{border-radius:var(--r-sm3)}
.search-toggle,.mcarousel-arrow,.g-dialog-close{
  border:1px solid var(--glass-edge);
  border-radius:50%;
  background:var(--glass-2);
  box-shadow:var(--shadow-soft);
  transform:none;
}
.search-toggle:hover,.mcarousel-arrow:hover,.g-dialog-close:hover{
  background:var(--glass-1);
  border-color:rgba(255,255,255,.95);
  box-shadow:var(--shadow);
  transform:translateY(-1px);
}
.g-dialog-close:hover{transform:rotate(90deg) translateY(-1px)}
.search-expand.open .search-toggle{background:rgba(242,41,127,.16);border-color:rgba(242,41,127,.4)}
.search-panel{
  background:rgba(255,255,255,.6);
  border:1px solid transparent;
  border-radius:var(--r-sm3);
  -webkit-backdrop-filter:blur(var(--blur-sm));
  backdrop-filter:blur(var(--blur-sm));
}
.search-expand.open .search-panel{
  border-color:var(--glass-edge);
  box-shadow:var(--shadow-soft);
}
.search-panel input,.search-panel input:focus{
  background:transparent;border:0;box-shadow:none;
}
.search-hit img{border:1px solid var(--glass-edge-soft);border-radius:8px}
.search-all{border-top:1px solid rgba(36,29,36,.08)}

/* ---------- 10. 背景音乐控件 ---------- */
.music-widget{
  background:var(--glass-1);
  border:1px solid var(--glass-edge);
  border-radius:999px;
  box-shadow:var(--shadow);
  -webkit-backdrop-filter:blur(var(--blur)) saturate(1.6);
  backdrop-filter:blur(var(--blur)) saturate(1.6);
}
.music-toggle{
  border:1px solid rgba(255,255,255,.6);
  border-radius:50%;
  background:linear-gradient(140deg,rgba(242,41,127,.92),rgba(242,41,127,.72));
  box-shadow:0 8px 20px -10px rgba(242,41,127,.8),inset 0 1px 0 rgba(255,255,255,.5);
}
.music-toggle:hover{background:linear-gradient(140deg,#fa3a8f,rgba(242,41,127,.85));transform:scale(1.06)}
.music-hint{
  background:rgba(36,29,36,.86);
  border:1px solid rgba(255,255,255,.16);
  border-radius:var(--r-sm1);
  box-shadow:var(--shadow-soft);
  -webkit-backdrop-filter:blur(var(--blur-sm));
  backdrop-filter:blur(var(--blur-sm));
}
.music-hint::after{border-top-color:rgba(36,29,36,.86)}
.eslider-track{
  border:1px solid rgba(255,255,255,.5);
  background:rgba(36,29,36,.14);
  border-radius:999px;
}
.eslider-range{background:linear-gradient(90deg,rgba(242,41,127,.85),rgba(255,210,63,.9))}
.eslider-thumb{
  border:1px solid rgba(255,255,255,.95);
  border-radius:50%;
  background:#fff;
  box-shadow:0 2px 10px rgba(36,29,36,.28),0 0 0 4px rgba(255,255,255,.28);
}
.eslider-hit:focus-visible .eslider-track{outline:2px solid var(--pink);outline-offset:3px}

/* ---------- 11. 首页轮播 ---------- */
.mcarousel-card{
  border:1px solid rgba(255,255,255,.35);
  border-radius:var(--mc-radius,20px);
  box-shadow:var(--shadow);
  background:#d8cfd6;
}
.mcarousel-tag{
  background:rgba(255,255,255,.24);
  border:1px solid rgba(255,255,255,.55);
  border-radius:999px;
  box-shadow:none;
  -webkit-backdrop-filter:blur(8px);
  backdrop-filter:blur(8px);
}
.mcarousel-title{text-shadow:0 2px 14px rgba(0,0,0,.5)}
.mcarousel-scrim{
  background:linear-gradient(to top,rgba(26,20,26,.78) 0%,rgba(26,20,26,.5) 20%,rgba(26,20,26,.16) 46%,transparent 68%);
}
.mcarousel-dot-mark{
  border:1px solid rgba(255,255,255,.7);
  background:rgba(255,255,255,.45);
  border-radius:50%;
  box-shadow:0 1px 6px rgba(36,29,36,.25);
}
.mcarousel-dot.is-active .mcarousel-dot-mark{
  background:linear-gradient(140deg,#fff,rgba(255,255,255,.7));
  transform:scale(1.3);
  box-shadow:0 0 0 4px rgba(242,41,127,.35);
}
.mcarousel-dot:not(.is-active):hover .mcarousel-dot-mark{background:rgba(255,255,255,.75)}

/* ---------- 12. 商品卡片（列表类：不启用模糊，性能优先） ---------- */
.hot-card,.g-card{
  background:linear-gradient(150deg,rgba(255,255,255,.9),rgba(255,255,255,.72));
  border:1px solid var(--glass-edge-soft);
  border-radius:var(--r-card);
  box-shadow:var(--shadow-soft),var(--shadow-inset);
  transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease,background .25s ease;
}
.hot-card:nth-child(4n+2),.hot-card:nth-child(4n+3),.hot-card:nth-child(4n),
.g-card:nth-child(3n+2),.g-card:nth-child(3n){
  border-radius:var(--r-card);
}
.hot-card:hover,.g-card:hover{
  transform:translateY(-4px);
  border-color:rgba(255,255,255,.95);
  background:linear-gradient(150deg,rgba(255,255,255,.98),rgba(255,255,255,.82));
  box-shadow:var(--shadow-hover),var(--shadow-inset);
}
.hot-img,.g-thumb{
  background:linear-gradient(160deg,#fbf4f8,#eef2fb);
  border-bottom:1px solid rgba(255,255,255,.75);
}
.hot-card:hover .hot-img img,.g-card:hover .g-thumb img{transform:scale(1.05)}
.hot-price,.g-dialog-price b{color:var(--pink);text-shadow:0 6px 18px rgba(242,41,127,.28)}
.hot-cat{color:#7a727a}
.hot-go{color:#7a727a}

/* 车型编号 / 价格角标：玻璃胶囊 */
.g-num,.g-dialog-num{
  background:rgba(255,255,255,.82);
  border:1px solid var(--glass-edge);
  border-radius:999px;
  color:var(--ink);
  transform:none;
  box-shadow:0 4px 12px -6px rgba(36,29,36,.35),inset 0 1px 0 rgba(255,255,255,.9);
  -webkit-backdrop-filter:blur(8px);
  backdrop-filter:blur(8px);
}
.g-price{
  background:linear-gradient(140deg,rgba(242,41,127,.94),rgba(242,41,127,.78));
  border:1px solid rgba(255,255,255,.55);
  border-radius:999px;
  transform:none;
  box-shadow:0 8px 20px -10px rgba(242,41,127,.85),inset 0 1px 0 rgba(255,255,255,.4);
}
.g-code code{
  border:1px solid rgba(36,29,36,.12);
  border-radius:6px;
  background:rgba(255,255,255,.55);
}
.g-more{color:#7a727a}
.g-card:hover .g-more{color:var(--pink-deep)}

/* ---------- 13. 筛选工具条 / 车房主体 ---------- */
.g-tools{
  background:linear-gradient(180deg,rgba(255,255,255,.84),rgba(255,255,255,.68));
  border-bottom:1px solid var(--glass-edge-soft);
  box-shadow:0 12px 28px -26px rgba(36,29,36,.6);
  -webkit-backdrop-filter:blur(var(--blur)) saturate(1.5);
  backdrop-filter:blur(var(--blur)) saturate(1.5);
}
.g-chip{
  background:rgba(255,255,255,.62);
  border:1px solid var(--glass-edge-soft);
  border-radius:999px;
  box-shadow:none;
  color:#4d454d;
  transition:background .2s,border-color .2s,box-shadow .2s,color .2s;
}
.g-chip:hover{
  background:rgba(255,255,255,.85);
  border-color:var(--glass-edge);
  transform:none;
  box-shadow:var(--shadow-soft);
}
.g-chip[aria-pressed="true"]{
  background:linear-gradient(140deg,rgba(242,41,127,.9),rgba(242,41,127,.7));
  border-color:rgba(255,255,255,.5);
  color:#fff;
  box-shadow:0 8px 22px -12px rgba(242,41,127,.9),inset 0 1px 0 rgba(255,255,255,.4);
}
.g-chip[aria-pressed="true"] b{color:rgba(255,255,255,.8)}
.g-search{
  background:rgba(255,255,255,.66);
  border:1px solid var(--glass-edge-soft);
  border-radius:var(--r-sm2);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8);
}
.g-search:focus-within{
  border-color:rgba(242,41,127,.55);
  background:rgba(255,255,255,.86);
  box-shadow:0 0 0 3px rgba(242,41,127,.16),inset 0 1px 0 rgba(255,255,255,.9);
}
.g-sort{
  background:rgba(255,255,255,.66);
  border:1px solid var(--glass-edge-soft);
  border-radius:var(--r-sm2);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8);
}
.g-strip{
  background:rgba(255,255,255,.5);
  border-bottom:1px solid var(--glass-edge-soft);
  -webkit-backdrop-filter:blur(var(--blur-sm));
  backdrop-filter:blur(var(--blur-sm));
}
.g-marquee{
  background:var(--glass-dark);
  border-top:1px solid rgba(255,255,255,.12);
  border-bottom:1px solid rgba(255,255,255,.12);
  color:rgba(255,255,255,.75);
  -webkit-backdrop-filter:blur(var(--blur-sm));
  backdrop-filter:blur(var(--blur-sm));
}
.g-pills span{
  background:rgba(255,255,255,.66);
  border:1px solid var(--glass-edge-soft);
  border-radius:999px;
  box-shadow:var(--shadow-inset);
  color:#4d454d;
}
.g-pills i{background:var(--pink);box-shadow:0 0 0 3px rgba(242,41,127,.18)}

/* ---------- 14. 空结果 ---------- */
.g-empty{
  background:rgba(255,255,255,.5);
  border:1px solid var(--glass-edge-soft);
  border-radius:var(--r-card);
  -webkit-backdrop-filter:blur(var(--blur-sm));
  backdrop-filter:blur(var(--blur-sm));
}

/* ---------- 15. 详情弹窗 ---------- */
.g-dialog::backdrop{
  background:rgba(36,29,36,.32);
  -webkit-backdrop-filter:blur(6px) saturate(1.1);
  backdrop-filter:blur(6px) saturate(1.1);
}
.g-dialog-sheet{
  background:var(--glass-1);
  border:1px solid var(--glass-edge);
  border-radius:var(--r-card);
  box-shadow:0 30px 80px -36px rgba(36,29,36,.6),var(--shadow-inset);
  -webkit-backdrop-filter:blur(var(--blur)) saturate(1.6);
  backdrop-filter:blur(var(--blur)) saturate(1.6);
}
.g-dialog-media{
  background:linear-gradient(160deg,rgba(255,255,255,.72),rgba(255,255,255,.4));
  border-right:1px solid rgba(255,255,255,.6);
}
.g-dialog-tag{
  background:rgba(255,255,255,.72);
  border:1px solid var(--glass-edge);
  border-radius:999px;
  box-shadow:var(--shadow-soft);
  -webkit-backdrop-filter:blur(8px);
  backdrop-filter:blur(8px);
}
.g-dialog-body h2{color:#1f1a20;text-shadow:none}
.g-dialog-price{
  border-top:1px solid rgba(36,29,36,.1);
  border-bottom:1px solid rgba(36,29,36,.1);
}
/* 数值内部的 span 需继承大号粉色，避免被通用 span 规则压成小灰字 */
.g-dialog-price b span{
  font-family:var(--mono);font-size:26px;letter-spacing:-.03em;
  color:var(--pink);text-shadow:0 6px 18px rgba(242,41,127,.28);
}
.g-dialog-nav{border-top:1px solid rgba(36,29,36,.1)}
.g-dialog-nav button{border:1px solid transparent;border-radius:10px;color:#6a626a}
.g-dialog-nav button:hover{
  background:rgba(255,255,255,.6);
  border-color:var(--glass-edge-soft);
  color:var(--pink-deep);
}

/* ---------- 16. FAQ ---------- */
.faq{border-top:1px solid var(--glass-edge-soft)}
.faq-list{border-top:1px solid rgba(36,29,36,.08)}
.faq details{border-bottom:1px solid rgba(36,29,36,.08)}
.faq summary:hover{color:var(--pink-deep)}
.faq summary::after{color:var(--pink);font-weight:600}
.faq details p{color:#57505a}

/* ---------- 17. 下单区 / 表单 ---------- */
.summary-card{
  background:var(--glass-dark);
  border:1px solid rgba(255,255,255,.16);
  border-radius:var(--r-card);
  box-shadow:0 24px 60px -30px rgba(36,29,36,.7),inset 0 1px 0 rgba(255,255,255,.14);
  -webkit-backdrop-filter:blur(var(--blur)) saturate(1.2);
  backdrop-filter:blur(var(--blur)) saturate(1.2);
  color:#fff;
}
.summary-card::after{
  border:1px solid rgba(242,41,127,.3);
  border-radius:50%;
  filter:blur(2px);
}
.summary-card .eyebrow{color:rgba(255,255,255,.6)}
.summary-coins b{color:#ffd23f;text-shadow:0 8px 26px rgba(255,210,63,.4)}
.summary-coins span,.summary-list li,.summary-empty{color:rgba(255,255,255,.68)}
.summary-list{border-top:1px solid rgba(255,255,255,.18)}
.summary-price{color:#ff9cc4}
.summary-actions button{
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.3);
  color:#fff;
  box-shadow:none;
  -webkit-backdrop-filter:blur(8px);
  backdrop-filter:blur(8px);
}
.summary-actions button:hover{
  background:rgba(255,255,255,.2);
  border-color:rgba(255,255,255,.55);
  box-shadow:0 10px 24px -12px rgba(0,0,0,.5);
}

.form-card{
  background:var(--glass-1);
  border:1px solid var(--glass-edge);
  border-radius:var(--r-card);
  box-shadow:var(--shadow),var(--shadow-inset);
  -webkit-backdrop-filter:blur(var(--blur)) saturate(1.5);
  backdrop-filter:blur(var(--blur)) saturate(1.5);
}
.form-head p,.field small{color:#6a626a}
.form-error{
  background:rgba(255,235,240,.8);
  border:1px solid rgba(217,43,79,.35);
  border-radius:var(--r-sm1);
  color:#b3173c;
  box-shadow:0 8px 20px -14px rgba(217,43,79,.6);
}

/* ---------- 18. 页脚 ---------- */
.site-foot{
  background:var(--glass-dark);
  color:rgba(255,255,255,.62);
  border-top:1px solid rgba(255,255,255,.14);
  -webkit-backdrop-filter:blur(var(--blur)) saturate(1.2);
  backdrop-filter:blur(var(--blur)) saturate(1.2);
}
.foot-brand .brand-mark{background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.25);color:#fff}
.foot-links a{color:rgba(255,255,255,.82);font-weight:500;transition:color .2s}
.foot-links a:hover{color:#fff;border-bottom:1px solid rgba(255,210,63,.7)}
.foot-note{border-top:1px solid rgba(255,255,255,.14);color:rgba(255,255,255,.55)}
.g-foot{
  background:rgba(255,255,255,.4);
  border-top:1px solid var(--glass-edge-soft);
  -webkit-backdrop-filter:blur(var(--blur-sm));
  backdrop-filter:blur(var(--blur-sm));
}
.g-foot-links a{color:#55505a;border:1px solid transparent;border-radius:var(--r-sm3)}
.g-foot-links a:hover{
  background:rgba(255,255,255,.6);
  border-color:var(--glass-edge-soft);
  transform:none;
}
.g-foot-note{border-top:1px solid rgba(36,29,36,.1)}

/* ---------- 19. 支付弹窗 ---------- */
dialog.pay-modal::backdrop{
  background:rgba(36,29,36,.35);
  -webkit-backdrop-filter:blur(6px);
  backdrop-filter:blur(6px);
}
.pay-sheet{
  background:linear-gradient(150deg,rgba(255,255,255,.94),rgba(255,255,255,.82));
  border:1px solid var(--glass-edge);
  border-radius:var(--r-card);
  box-shadow:0 30px 80px -36px rgba(36,29,36,.6),var(--shadow-inset);
  -webkit-backdrop-filter:blur(18px) saturate(1.6);
  backdrop-filter:blur(18px) saturate(1.6);
}
.icon-btn{background:rgba(255,255,255,.6);border:1px solid var(--glass-edge-soft);color:#56505a}
.pay-amount,.pay-meta,.qr-wrap{
  background:rgba(255,255,255,.62);
  border:1px solid var(--glass-edge-soft);
  border-radius:var(--r-sm2);
  box-shadow:var(--shadow-soft),var(--shadow-inset);
}
.pay-amount strong{color:var(--pink);text-shadow:0 8px 22px rgba(242,41,127,.3)}
.pay-meta div{border-bottom:1px solid rgba(36,29,36,.08)}
.qr-box{
  background:rgba(255,255,255,.9);
  border:1px solid var(--glass-edge-soft);
  border-radius:var(--r-sm2);
}
.qr-fallback{background:#fff}
.qr-badge{
  background:linear-gradient(140deg,rgba(242,41,127,.94),rgba(242,41,127,.78));
  border:1px solid rgba(255,255,255,.55);
  border-radius:999px;
  box-shadow:0 6px 16px -8px rgba(242,41,127,.8);
}
.pay-hint{
  background:rgba(242,41,127,.1);
  border:1px solid rgba(242,41,127,.22);
  border-radius:var(--r-sm2);
  color:#5b5059;
}
.pay-hint b{color:var(--pink-deep)}
.pay-actions{
  background:linear-gradient(180deg,rgba(255,255,255,.4),rgba(255,255,255,.88));
  border-top:1px solid rgba(36,29,36,.1);
  -webkit-backdrop-filter:blur(var(--blur-sm));
  backdrop-filter:blur(var(--blur-sm));
}
.pay-foot{color:#7a727a}

/* ---------- 20. Toast ---------- */
.toast{
  background:rgba(36,29,36,.86);
  border:1px solid rgba(255,255,255,.18);
  border-radius:var(--r-sm1);
  color:#fff;
  box-shadow:0 18px 40px -18px rgba(36,29,36,.7);
  transform:translate(-50%,16px);
  -webkit-backdrop-filter:blur(var(--blur-sm));
  backdrop-filter:blur(var(--blur-sm));
}
.toast.show{transform:translate(-50%,0)}

/* ---------- 21. 庆祝动效（保留原有效果，仅统一边缘质感） ---------- */
.celebrate{background:rgba(22,17,22,.86);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.sling-pad{
  border:1px solid rgba(255,255,255,.35);
  border-radius:50%;
  box-shadow:0 18px 44px -14px rgba(242,41,127,.8),inset 0 1px 0 rgba(255,255,255,.4);
}
.sling-band{box-shadow:none}
.celebrate-skip{border:1px solid rgba(255,255,255,.3);border-radius:999px;background:rgba(255,255,255,.08)}
.celebrate-skip:hover{background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.55)}

/* ---------- 22. 开屏预加载（配色对齐新背景） ---------- */
.preloader{
  background:radial-gradient(62% 55% at 50% 42%,#fffaf8 0%,#f7eef4 58%,#eef2fb 100%);
}

/* ---------- 23. 不模糊降级 ----------
   不支持 backdrop-filter 的浏览器：提高玻璃面不透明度，保证可读性 */
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .site-head,.g-head,.steps,.pass,.g-pass,.nav-menu,.search-results,
  .music-widget,.summary-card,.form-card,.site-foot,.pay-sheet,
  .g-tools,.g-dialog-sheet,.g-empty,.site-head,.topbar,.g-strip,.g-marquee,.g-foot,.toast{
    background:rgba(255,255,255,.95);
  }
  .summary-card,.site-foot,.topbar,.g-marquee{background:rgba(36,29,36,.96)}
  .hot-card,.g-card{background:rgba(255,255,255,.96)}
}

/* ---------- 24. 响应式 ---------- */
@media(max-width:1000px){
  .g-dialog-media{border-right:0;border-bottom:1px solid rgba(255,255,255,.6)}
}
@media(max-width:820px){
  .nav{
    background:linear-gradient(180deg,rgba(255,255,255,.92),rgba(255,255,255,.78));
    border-bottom:1px solid var(--glass-edge-soft);
    box-shadow:0 18px 40px -28px rgba(36,29,36,.6);
    -webkit-backdrop-filter:blur(var(--blur)) saturate(1.5);
    backdrop-filter:blur(var(--blur)) saturate(1.5);
  }
  .pass{margin:0 auto;transform:none}
  .step{border-bottom:1px solid rgba(36,29,36,.08)}
}
@media(max-width:760px){
  .g-stamp{transform:none}
  .g-dialog-media{border-bottom:1px solid rgba(255,255,255,.6)}
}
@media(max-width:640px){
  .music-widget{background:rgba(255,255,255,.78)}
  .pay-actions{background:linear-gradient(180deg,rgba(255,255,255,.35),rgba(255,255,255,.92))}
}

/* 减少动态效果：取消位移类过渡，只保留颜色与阴影变化 */
@media(prefers-reduced-motion:reduce){
  button:hover:not(:disabled),
  .g-btn:hover,
  .hot-card:hover,
  .g-card:hover,
  .pass:hover,
  .g-pass:hover{transform:none}
}
