/* [2026-09-17 #373] 全站載入旋轉 icon（金圈）＋ 頂部進度條 */
.sp {
  display: inline-block;
  width: 13px; height: 13px;
  border: 2px solid rgba(240, 185, 11, .25);
  border-top-color: #f0b90b;
  border-radius: 50%;
  animation: sp-rot .7s linear infinite;
  vertical-align: -2px;
}
.sp.lg { width: 22px; height: 22px; border-width: 3px; }
@keyframes sp-rot { to { transform: rotate(360deg); } }

#globalSpin {
  position: fixed; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, rgba(240,185,11,.15), #f0b90b, rgba(240,185,11,.15));
  transform-origin: left center;
  transform: scaleX(0);
  opacity: 0;
  transition: opacity .15s ease;
  z-index: 99999;
  pointer-events: none;
}
#globalSpin.on { opacity: 1; animation: sp-bar 1.1s ease-in-out infinite; }
@keyframes sp-bar {
  0%   { transform: scaleX(.05); }
  50%  { transform: scaleX(.65); }
  100% { transform: scaleX(.98); }
}

/* 卡片載入中：右上角小旋轉圈 + 輕微變暗，唔會移位 */
.sp-busy { position: relative; }
.sp-busy::after {
  content: '';
  position: absolute; top: 10px; right: 12px;
  width: 14px; height: 14px;
  border: 2px solid rgba(240, 185, 11, .25);
  border-top-color: #f0b90b;
  border-radius: 50%;
  animation: sp-rot .7s linear infinite;
  z-index: 5;
}
.sp-inline { color: #8b949e; font-size: 12px; display: inline-flex; align-items: center; gap: 6px; }