/* 冠世 logo 弹窗 v5 - Canvas 透明 + 暗黑金框 + 框内星光
 * 方案C: 金边星尘   D: 流光星光   E: 星钻圆环
 * 方案F: 星空毛玻璃 G: 双金边星辉
 * 星星全部在框内背景闪烁, logo 在上层
 */
#gs-splash{position:fixed;inset:0;display:none;align-items:center;justify-content:center;z-index:999999;pointer-events:none;background:transparent}
#gs-splash.gs-on{display:flex}

/* ---------- 方案C: 金边星尘 (圆角方框+框内星光) ---------- */
#gs-splash .gs-box.gs-c{
  width:140px;height:140px;border-radius:15px;position:relative;
  background:
    linear-gradient(165deg, rgba(28,26,46,0.82), rgba(12,10,24,0.76)) padding-box,
    linear-gradient(150deg, rgba(212,178,110,0.95), rgba(200,164,92,0.25) 45%, rgba(160,120,48,0.9)) border-box;
  border:1px solid transparent;
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  box-shadow:0 0 0 1px rgba(200,164,92,0.10),0 0 21px rgba(200,164,92,0.18),0 10px 31px rgba(0,0,0,0.5);
  opacity:0;transform:scale(.88) translateY(10px);
  transition:opacity .3s ease,transform .3s ease;
}
#gs-splash.gs-on .gs-box.gs-c{opacity:1;transform:scale(1) translateY(0)}
#gs-splash.gs-off .gs-box.gs-c{opacity:0;transform:scale(1.05);transition:opacity .45s ease,transform .45s ease}

/* ---------- 方案D: 流光星光 (流光边框+框内星光) ---------- */
#gs-splash .gs-box.gs-d{
  width:140px;height:140px;border-radius:15px;position:relative;
  background:linear-gradient(165deg, rgba(24,22,40,0.84), rgba(10,8,22,0.78));
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  border:1px solid rgba(200,164,92,0.35);
  box-shadow:0 0 18px rgba(200,164,92,0.20),0 10px 31px rgba(0,0,0,0.5);
  opacity:0;transform:scale(.88) translateY(10px);
  transition:opacity .3s ease,transform .3s ease;
}
#gs-splash.gs-on .gs-box.gs-d{opacity:1;transform:scale(1) translateY(0)}
#gs-splash.gs-off .gs-box.gs-d{opacity:0;transform:scale(1.05);transition:opacity .45s ease,transform .45s ease}
#gs-splash .gs-box.gs-d::before{
  content:'';position:absolute;inset:-18px;border-radius:17px;
  background:conic-gradient(transparent 0deg, rgba(212,178,110,0.85) 60deg, rgba(212,178,110,0.1) 120deg, transparent 180deg, rgba(212,178,110,0.5) 240deg, transparent 320deg);
  -webkit-mask:radial-gradient(farthest-side, transparent calc(100% - 2px), #000 calc(100% - 1px));
  mask:radial-gradient(farthest-side, transparent calc(100% - 2px), #000 calc(100% - 1px));
  animation:gs-rot 3.2s linear infinite;z-index:0;filter:blur(0.5px);
}
@keyframes gs-rot{ to{ transform:rotate(360deg); } }

/* ---------- 方案E: 星钻圆环 (圆形金环+框内星光) ---------- */
#gs-splash .gs-box.gs-e{
  width:140px;height:140px;border-radius:50%;position:relative;
  background:
    radial-gradient(circle at 50% 35%, rgba(36,32,58,0.85), rgba(12,10,24,0.8)) padding-box,
    conic-gradient(from 210deg, rgba(212,178,110,0.95), rgba(200,164,92,0.2) 30%, rgba(160,120,48,0.9) 55%, rgba(212,178,110,0.95)) border-box;
  border:1.5px solid transparent;
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  box-shadow:0 0 17px rgba(200,164,92,0.22),0 10px 31px rgba(0,0,0,0.5);
  opacity:0;transform:scale(.88) translateY(10px);
  transition:opacity .3s ease,transform .3s ease;
}
#gs-splash.gs-on .gs-box.gs-e{opacity:1;transform:scale(1) translateY(0)}
#gs-splash.gs-off .gs-box.gs-e{opacity:0;transform:scale(1.05);transition:opacity .45s ease,transform .45s ease}

/* ---------- 方案F: 星空毛玻璃 (细白边+深毛玻璃+密集星光) ---------- */
#gs-splash .gs-box.gs-f{
  width:140px;height:140px;border-radius:18px;position:relative;
  background:linear-gradient(165deg, rgba(30,30,48,0.55), rgba(14,14,28,0.5));
  border:1px solid rgba(255,255,255,0.14);
  backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  box-shadow:0 0 17px rgba(150,140,220,0.14),0 10px 31px rgba(0,0,0,0.45),inset 0 1px 0 rgba(255,255,255,0.08);
  opacity:0;transform:scale(.88) translateY(10px);
  transition:opacity .3s ease,transform .3s ease;
}
#gs-splash.gs-on .gs-box.gs-f{opacity:1;transform:scale(1) translateY(0)}
#gs-splash.gs-off .gs-box.gs-f{opacity:0;transform:scale(1.05);transition:opacity .45s ease,transform .45s ease}

/* ---------- 方案G: 双金边星辉 (内外金线+框内星光) ---------- */
#gs-splash .gs-box.gs-g{
  width:140px;height:140px;border-radius:15px;position:relative;
  background:linear-gradient(165deg, rgba(30,28,50,0.82), rgba(14,12,26,0.78));
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  border:1px solid rgba(200,164,92,0.55);
  box-shadow:0 0 0 2px rgba(200,164,92,0.14),0 0 0 3px rgba(12,10,24,0.9),0 0 0 3.5px rgba(200,164,92,0.25),0 0 17px rgba(200,164,92,0.2),0 10px 31px rgba(0,0,0,0.5);
  opacity:0;transform:scale(.88) translateY(10px);
  transition:opacity .3s ease,transform .3s ease;
}
#gs-splash.gs-on .gs-box.gs-g{opacity:1;transform:scale(1) translateY(0)}
#gs-splash.gs-off .gs-box.gs-g{opacity:0;transform:scale(1.05);transition:opacity .45s ease,transform .45s ease}

/* ---------- 方案H: 跑马虚线 (虚线沿边框流动 = 加载中) ---------- */
#gs-splash .gs-box.gs-h{
  width:140px;height:140px;border-radius:15px;position:relative;
  background:
    linear-gradient(165deg, rgba(28,26,46,0.82), rgba(12,10,24,0.76)) padding-box,
    repeating-linear-gradient(45deg, rgba(212,178,110,0.95) 0 7px, rgba(212,178,110,0.28) 7px 14px) border-box;
  border:1.5px solid transparent;
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  box-shadow:0 0 20px rgba(200,164,92,0.18),0 10px 31px rgba(0,0,0,0.5);
  animation:gs-dashmove 0.9s linear infinite;
  opacity:0;transform:scale(.88) translateY(10px);
  transition:opacity .3s ease,transform .3s ease;
}
#gs-splash.gs-on .gs-box.gs-h{opacity:1;transform:scale(1) translateY(0)}
#gs-splash.gs-off .gs-box.gs-h{opacity:0;transform:scale(1.05);transition:opacity .45s ease,transform .45s ease}
@keyframes gs-dashmove{ to{ background-position:0 0, 24px 24px; } }

/* ---------- 方案I: 光弧绕框 (金色光弧旋转 = 经典loading) ---------- */
#gs-splash .gs-box.gs-i{
  width:140px;height:140px;border-radius:15px;position:relative;
  background:linear-gradient(165deg, rgba(28,26,46,0.82), rgba(12,10,24,0.76));
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  border:1px solid rgba(200,164,92,0.25);
  box-shadow:0 0 20px rgba(200,164,92,0.16),0 10px 31px rgba(0,0,0,0.5);
  opacity:0;transform:scale(.88) translateY(10px);
  transition:opacity .3s ease,transform .3s ease;
}
#gs-splash.gs-on .gs-box.gs-i{opacity:1;transform:scale(1) translateY(0)}
#gs-splash.gs-off .gs-box.gs-i{opacity:0;transform:scale(1.05);transition:opacity .45s ease,transform .45s ease}
#gs-splash .gs-box.gs-i::before{
  content:'';position:absolute;inset:-1.5px;border-radius:18px;
  border:2px solid transparent;
  border-top-color:#ffd98a;
  border-right-color:rgba(255,217,138,0.55);
  filter:drop-shadow(0 0 5px rgba(255,205,130,0.85));
  animation:gs-spin 1s linear infinite;
  z-index:3;pointer-events:none;
}
@keyframes gs-spin{ to{ transform:rotate(360deg); } }

/* ---------- 方案L: 双环对转 (内外双光弧, 高级loading) ---------- */
#gs-splash .gs-box.gs-l{
  width:140px;height:140px;border-radius:15px;position:relative;
  background:linear-gradient(165deg, rgba(28,26,46,0.82), rgba(12,10,24,0.76));
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  border:1px solid rgba(200,164,92,0.22);
  box-shadow:0 0 20px rgba(200,164,92,0.16),0 10px 31px rgba(0,0,0,0.5);
  opacity:0;transform:scale(.88) translateY(10px);
  transition:opacity .3s ease,transform .3s ease;
}
#gs-splash.gs-on .gs-box.gs-l{opacity:1;transform:scale(1) translateY(0)}
#gs-splash.gs-off .gs-box.gs-l{opacity:0;transform:scale(1.05);transition:opacity .45s ease,transform .45s ease}
#gs-splash .gs-box.gs-l::before{
  content:'';position:absolute;inset:-1.5px;border-radius:18px;
  border:2px solid transparent;
  border-top-color:#ffd98a;
  filter:drop-shadow(0 0 5px rgba(255,205,130,0.9));
  animation:gs-spin 1.1s linear infinite;
  z-index:3;pointer-events:none;
}
#gs-splash .gs-box.gs-l::after{
  content:'';position:absolute;inset:-6px;border-radius:22px;
  border:1.5px solid transparent;
  border-bottom-color:rgba(160,120,220,0.85);
  border-left-color:rgba(160,120,220,0.4);
  filter:drop-shadow(0 0 3.5px rgba(170,130,230,0.7));
  animation:gs-spin-rev 1.6s linear infinite;
  z-index:3;pointer-events:none;
}
@keyframes gs-spin-rev{ to{ transform:rotate(-360deg); } }

/* ---------- 方案M: 雷达扫描 (框内金色扫描线旋转) ---------- */
#gs-splash .gs-box.gs-m{
  width:140px;height:140px;border-radius:15px;position:relative;
  background:linear-gradient(165deg, rgba(26,24,44,0.84), rgba(10,8,22,0.78));
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  border:1px solid rgba(200,164,92,0.4);
  box-shadow:0 0 20px rgba(200,164,92,0.18),0 10px 31px rgba(0,0,0,0.5);
  overflow:hidden;
  opacity:0;transform:scale(.88) translateY(10px);
  transition:opacity .3s ease,transform .3s ease;
}
#gs-splash.gs-on .gs-box.gs-m{opacity:1;transform:scale(1) translateY(0)}
#gs-splash.gs-off .gs-box.gs-m{opacity:0;transform:scale(1.05);transition:opacity .45s ease,transform .45s ease}
#gs-splash .gs-box.gs-m::after{
  content:'';position:absolute;inset:0;border-radius:inherit;
  background:conic-gradient(from 0deg, rgba(255,217,138,0.4), rgba(255,217,138,0.06) 55deg, transparent 90deg);
  animation:gs-spin 1.8s linear infinite;
  z-index:0;pointer-events:none;
}
#gs-splash .gs-box.gs-m::before{
  content:'';position:absolute;inset:0;border-radius:inherit;
  background:radial-gradient(circle at 50% 50%, transparent 55%, rgba(200,164,92,0.15) 78%, transparent 82%);
  z-index:0;pointer-events:none;
}

/* ---------- 方案S: 扫光 (金色光带框内来回扫) ---------- */
#gs-splash .gs-box.gs-s{
  width:140px;height:140px;border-radius:15px;position:relative;
  background:linear-gradient(165deg, rgba(28,26,46,0.82), rgba(12,10,24,0.76));
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  border:1px solid rgba(200,164,92,0.3);
  box-shadow:0 0 20px rgba(200,164,92,0.16),0 10px 31px rgba(0,0,0,0.5);
  overflow:hidden;
  opacity:0;transform:scale(.88) translateY(10px);
  transition:opacity .3s ease,transform .3s ease;
}
#gs-splash.gs-on .gs-box.gs-s{opacity:1;transform:scale(1) translateY(0)}
#gs-splash.gs-off .gs-box.gs-s{opacity:0;transform:scale(1.05);transition:opacity .45s ease,transform .45s ease}
#gs-splash .gs-box.gs-s::after{
  content:'';position:absolute;inset:0;border-radius:inherit;
  background:linear-gradient(105deg, transparent 42%, rgba(255,225,160,0.28) 50%, transparent 58%);
  background-size:220% 100%;
  animation:gs-sweep 1.5s ease-in-out infinite;
  z-index:3;pointer-events:none;
}
@keyframes gs-sweep{ 0%{background-position:220% 0} 100%{background-position:-220% 0} }

/* ---------- 方案V: 流星光点 (光点高速绕框带拖尾) ---------- */
#gs-splash .gs-box.gs-v{
  width:140px;height:140px;border-radius:15px;position:relative;
  background:linear-gradient(165deg, rgba(26,24,44,0.84), rgba(10,8,22,0.78));
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  border:1px solid rgba(200,164,92,0.28);
  box-shadow:0 0 20px rgba(200,164,92,0.16),0 10px 31px rgba(0,0,0,0.5);
  opacity:0;transform:scale(.88) translateY(10px);
  transition:opacity .3s ease,transform .3s ease;
}
#gs-splash.gs-on .gs-box.gs-v{opacity:1;transform:scale(1) translateY(0)}
#gs-splash.gs-off .gs-box.gs-v{opacity:0;transform:scale(1.05);transition:opacity .45s ease,transform .45s ease}
#gs-splash .gs-box.gs-v::before{
  content:'';position:absolute;inset:-1.5px;border-radius:18px;
  border:2px solid transparent;
  border-top-color:#ffe9b0;
  filter:drop-shadow(0 0 7px rgba(255,215,140,0.95));
  animation:gs-spin 0.65s linear infinite;
  z-index:3;pointer-events:none;
}

/* ---------- 方案O: 电流涌动 (金色电流高速旋转) ---------- */
#gs-splash .gs-box.gs-o{
  width:140px;height:140px;border-radius:15px;position:relative;
  background:linear-gradient(165deg, rgba(26,24,44,0.84), rgba(10,8,22,0.78));
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  border:1px solid rgba(200,164,92,0.25);
  box-shadow:0 0 20px rgba(200,164,92,0.16),0 10px 31px rgba(0,0,0,0.5);
  opacity:0;transform:scale(.88) translateY(10px);
  transition:opacity .3s ease,transform .3s ease;
}
#gs-splash.gs-on .gs-box.gs-o{opacity:1;transform:scale(1) translateY(0)}
#gs-splash.gs-off .gs-box.gs-o{opacity:0;transform:scale(1.05);transition:opacity .45s ease,transform .45s ease}
#gs-splash .gs-box.gs-o::before{
  content:'';position:absolute;inset:-1.5px;border-radius:17px;
  border:2px solid transparent;
  border-top-color:#ffd98a;
  border-bottom-color:rgba(255,217,138,0.5);
  filter:drop-shadow(0 0 4px rgba(255,205,130,0.8));
  animation:gs-spin 0.5s linear infinite;
  z-index:3;pointer-events:none;
}

/* ---------- 方案Z: 电流涌动 + 扫光组合 ---------- */
#gs-splash .gs-box.gs-z{
  width:140px;height:140px;border-radius:15px;position:relative;
  background:linear-gradient(165deg, rgba(26,24,44,0.84), rgba(10,8,22,0.78));
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  border:1px solid rgba(200,164,92,0.25);
  box-shadow:0 0 20px rgba(200,164,92,0.16),0 10px 31px rgba(0,0,0,0.5);
  opacity:0;transform:scale(.88) translateY(10px);
  transition:opacity .3s ease,transform .3s ease;
}
#gs-splash.gs-on .gs-box.gs-z{opacity:1;transform:scale(1) translateY(0)}
#gs-splash.gs-off .gs-box.gs-z{opacity:0;transform:scale(1.05);transition:opacity .45s ease,transform .45s ease}
#gs-splash .gs-box.gs-z::before{
  content:'';position:absolute;inset:-1.5px;border-radius:17px;
  border:2px solid transparent;
  border-top-color:#ffd98a;
  border-bottom-color:rgba(255,217,138,0.5);
  filter:drop-shadow(0 0 4px rgba(255,205,130,0.8));
  animation:gs-spin 0.5s linear infinite;
  z-index:3;pointer-events:none;
}
#gs-splash .gs-box.gs-z::after{
  content:'';position:absolute;inset:0;border-radius:inherit;
  background:linear-gradient(105deg, transparent 42%, rgba(255,225,160,0.3) 50%, transparent 58%);
  background-size:220% 100%;
  animation:gs-sweep 1.4s ease-in-out infinite;
  z-index:3;pointer-events:none;
}

/* ---------- 星光粒子 (全部在框内, logo 下层) ---------- */
.gs-stars{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:2}
#gs-splash canvas{position:absolute;z-index:1;left:50%;top:50%;width:70%;height:70%;transform:translate(-50%,-50%);display:block;border-radius:inherit}
.gs-star{position:absolute;border-radius:50%;opacity:0;animation:gs-twinkle 2.2s ease-in-out infinite;pointer-events:none}
.gs-star.gs-gold{background:#ffd98a;box-shadow:0 0 4px rgba(255,210,130,0.9)}
.gs-star.gs-white{background:#e8ecff;box-shadow:0 0 3.5px rgba(190,205,255,0.85)}
.gs-star.gs-warm{background:#fff0c8;box-shadow:0 0 5px rgba(255,225,160,0.9)}
@keyframes gs-twinkle{
  0%,100%{opacity:.25;transform:scale(.6)}
  50%{opacity:1;transform:scale(1.2)}
}