/* glass-tokens.css — CityPLX 全站统一玻璃（2026-10-15 Hannah：聊天卡片「这个 visionpro 的感觉就很好，所有的页面都复用这个，
   磨砂程度之类的都复用这个」）。数值逐项取自 vivo-chat-ui.css 的聊天卡片 .sc-v2 .c2-card（--c2-glass / --c2-blur / --c2-edge /
   --c2-ink、.c2-x、.c2-act、.sc-send）。index.html 最先加载；kit/glass-unify.css 把各界面接到这些变量上。
   新写的界面直接用 .glass-panel / .glass-pill / .glass-btn / .glass-btn.is-prom / .glass-icon-btn。 */
:root {
  /* 面板 */
  --glass-sheen: linear-gradient(155deg, rgba(255, 255, 255, 0.30), rgba(255, 255, 255, 0.10) 55%, rgba(255, 255, 255, 0.06));
  --glass-tint: rgba(32, 34, 46, 0.30);
  --glass-tint-strong: rgba(32, 34, 46, 0.42);   /* 大面积弹窗（地图、护照外框）略压暗，文字更稳 */
  --glass-bg: var(--glass-sheen), var(--glass-tint);
  --glass-bg-strong: var(--glass-sheen), var(--glass-tint-strong);
  --glass-blur: blur(34px) saturate(190%);
  --glass-edge: inset 1.5px 1.5px 0 rgba(255, 255, 255, 0.62), inset -1px -1px 0 rgba(255, 255, 255, 0.14), inset 0 0 0 1px rgba(255, 255, 255, 0.26);
  --glass-drop: 0 18px 44px rgba(0, 0, 0, 0.16);
  --glass-drop-sm: 0 10px 28px rgba(0, 0, 0, 0.12);
  --glass-shadow: var(--glass-drop), var(--glass-edge);
  --glass-shadow-sm: var(--glass-drop-sm), var(--glass-edge);
  --glass-radius: 26px;
  --glass-radius-sm: 18px;
  --glass-radius-pill: 999px;
  /* 文字 */
  --glass-font: -apple-system, "SF Pro Text", "PingFang SC", system-ui, sans-serif;
  --glass-t1: #fff;
  --glass-t2: rgba(255, 255, 255, 0.82);
  --glass-t3: rgba(255, 255, 255, 0.6);
  --glass-ink: 0 1px 2px rgba(0, 0, 0, 0.38), 0 0 12px rgba(0, 0, 0, 0.18);
  /* 按钮：暗玻璃（.c2-x）、亮玻璃主按钮（.c2-act）、发送圆钮（.sc-send） */
  --glass-btn-bg: rgba(255, 255, 255, 0.16);
  --glass-btn-bg-hover: rgba(255, 255, 255, 0.26);
  --glass-btn-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5), inset 0 0 0 1px rgba(255, 255, 255, 0.22);
  --glass-prom-bg: linear-gradient(180deg, rgba(255, 255, 255, 0.42), rgba(255, 255, 255, 0.2));
  --glass-prom-bg-hover: linear-gradient(180deg, rgba(255, 255, 255, 0.52), rgba(255, 255, 255, 0.28));
  --glass-prom-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7), inset 0 0 0 1px rgba(255, 255, 255, 0.3);
  --glass-solid-bg: linear-gradient(180deg, rgba(255, 255, 255, 0.62), rgba(255, 255, 255, 0.34));
  --glass-solid-shadow: inset 0 1.5px 0 rgba(255, 255, 255, 0.85), inset 0 0 0 1px rgba(255, 255, 255, 0.4), 0 4px 12px rgba(0, 0, 0, 0.14);
  --glass-ease: cubic-bezier(0.2, 0.8, 0.2, 1);
  /* 全屏面板背后的商场（10-20 Hannah 选中档）：能认出商场、店铺和人影，细节不抢字。衣柜、护照先用；只用在最外层（嵌套的 backdrop-filter 采不到画面） */
  --glass-backdrop-panel: blur(12px) saturate(0.72) brightness(0.8);
  --glass-backdrop-panel-bg: rgba(14, 16, 24, 0.24);
}

/* 通用类 */
.glass-panel, .glass-pill {
  background: var(--glass-bg);
  -webkit-backdrop-filter: var(--glass-blur);
  backdrop-filter: var(--glass-blur);
  box-shadow: var(--glass-shadow);
  border: 0;
  border-radius: var(--glass-radius);
  color: var(--glass-t1);
  font-family: var(--glass-font);
  text-shadow: var(--glass-ink);
}
.glass-pill { border-radius: var(--glass-radius-pill); box-shadow: var(--glass-shadow-sm); }
.glass-btn, .glass-icon-btn {
  border: 0;
  cursor: pointer;
  color: var(--glass-t1);
  font: 600 13px var(--glass-font);
  text-shadow: var(--glass-ink);
  background: var(--glass-btn-bg);
  box-shadow: var(--glass-btn-shadow);
  transition: background 0.2s, transform 0.2s;
}
.glass-btn { height: 32px; padding: 0 13px; border-radius: var(--glass-radius-pill); }
.glass-btn.is-prom { background: var(--glass-prom-bg); box-shadow: var(--glass-prom-shadow); }
.glass-icon-btn { width: 32px; height: 32px; padding: 0; border-radius: 50%; display: inline-grid; place-items: center; }
.glass-btn:hover, .glass-icon-btn:hover { background: var(--glass-btn-bg-hover); }
.glass-btn.is-prom:hover { background: var(--glass-prom-bg-hover); }
.glass-btn:active, .glass-icon-btn:active { transform: scale(0.96); }