/* ============================================================
   SCISY UI Kit · 按钮设计系统 (a299)
   常态 = 胶囊 + 液体玻璃; 悬停/触摸/进行中 = 胶囊 + 霓虹辉光; 完成 = 回常态
   作用于既有按钮类: .btn .btn-primary .filesbtn .projpill .sidetoggle 及 [data-icon] 图标按钮
   增强层, 不改结构; 尊重 prefers-reduced-* 兜底
   ============================================================ */
:root{
  --neon: var(--brand, #2f6df6);            /* 霓虹主色, 默认取品牌色 */
  --neon-2: color-mix(in srgb, var(--neon) 60%, #7cf 40%);
  --glass-bg: rgba(255,255,255,.55);
  --glass-bd: rgba(255,255,255,.65);
  --glass-sh: rgba(20,30,60,.10);
  --cap-radius: 999px;                       /* 胶囊 */
}
@media (prefers-color-scheme: dark){
  :root{ --glass-bg: rgba(38,44,60,.48); --glass-bd: rgba(255,255,255,.14); --glass-sh: rgba(0,0,0,.4); }
}

/* ---------- 常态: 胶囊 + 液体玻璃 ---------- */
.btn, .btn-primary, .filesbtn, .projpill, .sidetoggle, .ui-btn{
  position: relative;
  border-radius: var(--cap-radius) !important;
  border: 1px solid var(--glass-bd);
  background: linear-gradient(180deg, rgba(255,255,255,.22), rgba(255,255,255,0) 42%), var(--glass-bg);
  -webkit-backdrop-filter: blur(10px) saturate(160%);
  backdrop-filter: blur(10px) saturate(160%);
  box-shadow: 0 1px 0 rgba(255,255,255,.55) inset, 0 6px 16px -8px var(--glass-sh);
  transition: box-shadow .22s ease, transform .12s ease, border-color .22s ease, background .22s ease;
  -webkit-tap-highlight-color: transparent;
}
/* 液体高光: 顶部一道细亮弧 */
.btn::after, .btn-primary::after, .filesbtn::after, .projpill::after, .ui-btn::after{
  content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none;
  background: radial-gradient(120% 60% at 50% -20%, rgba(255,255,255,.5), rgba(255,255,255,0) 60%);
  opacity:.7;
}

/* 主按钮常态稍带品牌底色 */
.btn-primary{
  background: linear-gradient(180deg, color-mix(in srgb,var(--neon) 22%, #fff 78%), color-mix(in srgb,var(--neon) 12%, #fff 88%));
  border-color: color-mix(in srgb, var(--neon) 40%, var(--glass-bd));
  color: color-mix(in srgb, var(--neon) 70%, #12305e);
}

/* ---------- 悬停 / 触摸 / :active: 胶囊 + 霓虹辉光 ---------- */
.btn:hover, .btn-primary:hover, .filesbtn:hover, .projpill:hover, .sidetoggle:hover, .ui-btn:hover,
.btn:focus-visible, .btn-primary:focus-visible, .filesbtn:focus-visible, .ui-btn:focus-visible,
.btn:active, .btn-primary:active, .filesbtn:active, .ui-btn:active{
  border-color: color-mix(in srgb, var(--neon) 70%, transparent);
  box-shadow:
    0 0 0 1px color-mix(in srgb, var(--neon) 55%, transparent),
    0 0 10px -1px var(--neon),
    0 0 22px -4px var(--neon-2),
    0 8px 20px -10px var(--glass-sh);
  transform: translateY(-1px);
}
.btn:active, .btn-primary:active, .filesbtn:active, .ui-btn:active{ transform: translateY(0) scale(.98); }
@media (hover:none){                       /* 触屏: 用 :active 模拟触摸辉光 */
  .btn:active, .btn-primary:active, .filesbtn:active, .ui-btn:active{ transform: scale(.97); }
}

/* ---------- 进行中(持续状态): 胶囊 + 霓虹辉光 + 呼吸 ---------- */
/* 给按钮加 class="is-busy" 或 属性 [data-busy] 即进入; 完成移除即回常态 */
.is-busy, [data-busy="1"]{
  border-color: color-mix(in srgb, var(--neon) 70%, transparent) !important;
  animation: sci-neon-breathe 1.25s ease-in-out infinite;
  cursor: progress;
}
.is-busy::before, [data-busy="1"]::before{        /* 进度扫光 */
  content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none;
  background: linear-gradient(100deg, transparent 20%, color-mix(in srgb,var(--neon) 35%, transparent) 50%, transparent 80%);
  background-size: 200% 100%;
  animation: sci-neon-sweep 1.25s linear infinite;
  mix-blend-mode: screen;
}
@keyframes sci-neon-breathe{
  0%,100%{ box-shadow: 0 0 0 1px color-mix(in srgb,var(--neon) 45%,transparent), 0 0 8px -2px var(--neon), 0 6px 16px -10px var(--glass-sh); }
  50%    { box-shadow: 0 0 0 1px color-mix(in srgb,var(--neon) 70%,transparent), 0 0 18px 0 var(--neon), 0 0 30px -4px var(--neon-2), 0 8px 20px -10px var(--glass-sh); }
}
@keyframes sci-neon-sweep{ from{ background-position: 200% 0; } to{ background-position: -60% 0; } }

/* ---------- 图标按钮 / 内联图标 ---------- */
.sci-ic{ width:1.05em; height:1.05em; display:inline-block; vertical-align:-.16em; stroke:currentColor; fill:none;
  stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
/* ★a711 消息操作条的图标统一 16px(用户选 B)。
   这一排两种图标来源:sciIcon() 出 .sci-ic(默认 1.05em,在 12px 字号下=12.6px)、
   emoji 经 mountBtnIcons 换成 .btn-ic>svg(SVG 自带 width="16")。
   B = 把 .sci-ic 在【这一排】放大到 16px,两边一致且图标更清楚(A 是反过来把 16 缩到 12.6,用户不要)。
   能真统一的前提(已核对):两套 SVG 都是 viewBox="0 0 24 24" + stroke-width:2 + 同 linecap/linejoin,
   所以同尺寸下渲染完全一致,不会出现"一样大但粗细不同"。
   ★只在 .msg-actions 内生效,全站别处的 .sci-ic 仍是 1.05em(随字号缩放),不受影响。 */
.msg-actions span .sci-ic{ margin-right:3px; width:16px; height:16px; }
.ui-iconbtn{ display:inline-flex; align-items:center; justify-content:center; gap:6px; padding:6px 12px; cursor:pointer; }

/* ---------- 会员等级徽章(唯一允许 emoji) ---------- */
.tier-badge{ display:inline-flex; align-items:center; gap:4px; padding:1px 9px; border-radius:999px; font-size:12px; font-weight:600;
  border:1px solid var(--glass-bd); background:var(--glass-bg); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); }
.tier-free   { color:#607089; }
.tier-basic  { color:#2f6df6; border-color:color-mix(in srgb,#2f6df6 40%,transparent); }
.tier-pro    { color:#8a5cf6; border-color:color-mix(in srgb,#8a5cf6 40%,transparent); }
.tier-flagship{ color:#c8891b; border-color:color-mix(in srgb,#c8891b 45%,transparent);
  box-shadow:0 0 10px -3px #e6b24a; }

/* ---------- 无障碍兜底 ---------- */
@media (prefers-reduced-transparency: reduce){
  .btn,.btn-primary,.filesbtn,.projpill,.sidetoggle,.ui-btn{
    -webkit-backdrop-filter:none; backdrop-filter:none; background:var(--card,#fff); }
}
@media (prefers-reduced-motion: reduce){
  .btn,.btn-primary,.filesbtn,.ui-btn{ transition:none; }
  .is-busy,[data-busy="1"]{ animation:none; }
  .is-busy::before,[data-busy="1"]::before{ animation:none; }
}