/* 网速测试卡片（2026-11-06）
   沿用「纯黑极简」定稿：无面板、无边框、无毛玻璃，控件直接浮在星尘上。
   所有选择器带 .spd 前缀，不与 legacy/app.css 的业务样式互相影响。 */
.spd [hidden]{display:none!important}

/* 这张卡片的小字（状态 / 结果说明 / 精度提示）比别的卡片多，纯黑星尘下会发花。
   沿用页头 .head::before 的手法：只加一层局部径向黑晕压住粒子，边缘透明渐隐，
   不引入面板、不吃指针事件；isolation 保证 z-index:-1 只在本块内下沉。 */
.spd{position:relative;isolation:isolate}
.spd::before{content:"";position:absolute;inset:-18px -30px;z-index:-1;
  pointer-events:none;
  background:radial-gradient(ellipse 64% 82% at 50% 50%,
    rgba(0,0,0,.93) 0%,rgba(0,0,0,.80) 46%,rgba(0,0,0,0) 100%)}
.spd-state,.spd-note,.spd-tip{text-shadow:0 0 5px #000,0 0 2px #000}

.spd-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
/* 冷却 / 限次中：按钮禁用并显示倒计时，视觉上明确不可点 */
#spdStart:disabled{opacity:.52;cursor:not-allowed;filter:saturate(.5);transform:none}
#spdStart:disabled:hover{transform:none}
.spd-state{color:var(--sub);font-size:13px;line-height:1.5}
.spd-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;margin-top:14px}
.spd-m{background:rgba(255,255,255,.05);
  border:1px solid rgba(199,210,254,.18);
  border-radius:12px;padding:10px 6px;text-align:center;
  transition:border-color .2s,background .2s}
.spd-m.act{border-color:rgba(32,201,114,.55);background:rgba(32,201,114,.09)}
.spd-m b{display:block;color:#EDF3FF;font-size:clamp(19px,4.6vw,27px);
  font-weight:600;line-height:1.25;white-space:nowrap}
.spd-m span{display:block;color:var(--sub);font-size:12px;margin-top:3px}
.spd-bar{height:4px;margin-top:12px;border-radius:4px;overflow:hidden;
  background:rgba(255,255,255,.09)}
.spd-bar i{display:block;height:100%;width:0;background:#20C972;
  transition:width .25s linear}
.spd-note{margin-top:10px;color:#4BE09A;font-size:13px;line-height:1.6}
.spd-note.warn{color:#FFC86B}
.spd-tip{margin-top:10px;color:var(--sub);font-size:12px;line-height:1.65}
@media(max-width:620px){
  .spd-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
  .spd-row{gap:10px}
}

/* 宽屏同步收小测速卡的局部黑晕（与 app.css 的 .wrap::before 同一次调整）：
   中心黑度不变、只收边缘范围，减少「没有星尘」的纯黑面积；
   手机保留上方原值，保护 tip 小字不被颗粒压花。 */
@media(min-width:900px){
  .spd::before{inset:-12px -20px;
    background:radial-gradient(ellipse 56% 74% at 50% 50%,
      rgba(0,0,0,.93) 0%,rgba(0,0,0,.78) 50%,rgba(0,0,0,0) 100%)}
}