/* ===========================================================
   NATIONAL TEAM · effects.css
   光标 / 噪点 / 极光 / 揭示 / 3D 倾斜 / 光晕 / 跑马灯 / 进度条
   =========================================================== */

/* ---------- 自定义光标 ---------- */
.cursor-dot,.cursor-ring{position:fixed;top:0;left:0;z-index:9999;pointer-events:none;border-radius:50%;
  transform:translate3d(-100px,-100px,0);will-change:transform}
.cursor-dot{width:5px;height:5px;background:#fff;box-shadow:0 0 10px rgba(255,255,255,.9)}
.cursor-ring{width:34px;height:34px;border:1px solid rgba(255,255,255,.34);transition:width .25s var(--ease),height .25s var(--ease),border-color .25s,background .25s}
.cursor-ring.hot{width:58px;height:58px;border-color:var(--accent-2);background:rgba(224,18,44,.12)}
@media (hover:none),(max-width:900px){.cursor-dot,.cursor-ring{display:none}}

/* ---------- 胶片噪点 + 扫描线 ---------- */
.noise{position:fixed;inset:0;z-index:60;pointer-events:none;opacity:.055;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:noiseShift 8s steps(6) infinite}
@keyframes noiseShift{0%{transform:translate(0,0)}20%{transform:translate(-2%,1%)}40%{transform:translate(1%,-2%)}60%{transform:translate(-1%,-1%)}80%{transform:translate(2%,1%)}100%{transform:translate(0,0)}}
.scanline{position:fixed;inset:0;z-index:59;pointer-events:none;opacity:.16;
  background:repeating-linear-gradient(180deg,rgba(255,255,255,.045) 0 1px,transparent 1px 4px);
  mask-image:linear-gradient(180deg,transparent,#000 30%,#000 70%,transparent)}

/* ---------- 滚动进度 ---------- */
.scroll-progress{position:fixed;top:0;left:0;height:2px;width:0;z-index:90;
  background:linear-gradient(90deg,var(--accent),var(--gold),var(--cyan));box-shadow:0 0 16px rgba(224,18,44,.8)}

/* ---------- 揭示动画 ---------- */
[data-reveal]{opacity:0;transform:translateY(34px) scale(.985);
  transition:opacity .9s var(--ease),transform .9s var(--ease)}
[data-reveal].in{opacity:1;transform:none}
[data-reveal="left"]{transform:translateX(-46px)}
[data-reveal="right"]{transform:translateX(46px)}
[data-reveal="zoom"]{transform:scale(.9)}
[data-delay="1"]{transition-delay:.09s}[data-delay="2"]{transition-delay:.18s}
[data-delay="3"]{transition-delay:.27s}[data-delay="4"]{transition-delay:.36s}
[data-delay="5"]{transition-delay:.45s}[data-delay="6"]{transition-delay:.54s}

/* ---------- 3D 倾斜卡 ---------- */
.tilt{transform-style:preserve-3d;will-change:transform;transition:transform .45s var(--ease),box-shadow .45s}
.tilt .tilt-inner{transform:translateZ(38px)}
.tilt .tilt-glare{position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .35s;
  background:radial-gradient(320px circle at var(--gx,50%) var(--gy,50%),rgba(255,255,255,.16),transparent 62%)}
.tilt:hover .tilt-glare{opacity:1}

/* ---------- 磁吸 ---------- */
.magnet{transition:transform .35s var(--ease)}

/* ---------- 光晕 / 描边流光 ---------- */
.glow-ring{position:relative}
.glow-ring::after{content:"";position:absolute;inset:-1px;border-radius:inherit;pointer-events:none;
  background:conic-gradient(from var(--ang,0deg),transparent 0deg,var(--accent-2) 40deg,transparent 90deg,transparent 270deg,var(--gold) 310deg,transparent 360deg);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;padding:1px;opacity:0;transition:opacity .4s}
.glow-ring:hover::after{opacity:.95;animation:angSpin 4s linear infinite}
@keyframes angSpin{to{--ang:360deg}}
@property --ang{syntax:'<angle>';initial-value:0deg;inherits:false}

/* ---------- 跑马灯 ---------- */
.marquee{overflow:hidden;position:relative;
  mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.marquee-track{display:flex;gap:0;width:max-content;animation:marq 42s linear infinite}
.marquee:hover .marquee-track{animation-play-state:paused}
@keyframes marq{to{transform:translateX(-50%)}}
.marquee-item{display:inline-flex;align-items:center;gap:12px;padding:0 26px;white-space:nowrap;
  font-size:13px;letter-spacing:.1em;color:var(--dim);border-right:1px solid var(--line)}
.marquee-item b{color:var(--ink-2);font-weight:600}
.marquee-item::before{content:"";width:4px;height:4px;border-radius:50%;background:var(--accent);box-shadow:0 0 8px var(--accent)}

/* ---------- 数字滚动 ---------- */
.count{font-variant-numeric:tabular-nums;letter-spacing:-.02em}

/* ---------- 版面装饰角标 ---------- */
.corner{position:absolute;width:16px;height:16px;border:1px solid var(--line-strong);pointer-events:none}
.corner.tl{top:12px;left:12px;border-right:0;border-bottom:0}
.corner.tr{top:12px;right:12px;border-left:0;border-bottom:0}
.corner.bl{bottom:12px;left:12px;border-right:0;border-top:0}
.corner.br{bottom:12px;right:12px;border-left:0;border-top:0}

/* ---------- 分栏标题 ---------- */
.split-title{display:flex;align-items:flex-end;gap:18px;flex-wrap:wrap;justify-content:space-between}
.split-title .idx{font-family:"DIN Alternate","Bahnschrift",monospace;font-size:clamp(38px,7vw,86px);
  line-height:.8;font-weight:800;color:transparent;-webkit-text-stroke:1px rgba(160,190,230,.34)}

/* ---------- 进度条 ---------- */
.bar{height:4px;border-radius:99px;background:rgba(255,255,255,.08);overflow:hidden}
.bar i{display:block;height:100%;width:0;border-radius:99px;
  background:linear-gradient(90deg,var(--accent),var(--gold));transition:width 1.4s var(--ease)}

/* ---------- 噪点 + 光带 ---------- */
.aurora{position:absolute;inset:-20% -10%;pointer-events:none;z-index:0;filter:blur(70px);opacity:.5}
.aurora i{position:absolute;border-radius:50%;mix-blend-mode:screen;animation:floaty 18s ease-in-out infinite}
.aurora i:nth-child(1){width:44vw;height:26vw;left:-6%;top:4%;background:rgba(224,18,44,.36)}
.aurora i:nth-child(2){width:38vw;height:22vw;right:-4%;top:18%;background:rgba(55,220,255,.22);animation-delay:-6s}
.aurora i:nth-child(3){width:34vw;height:20vw;left:32%;bottom:-6%;background:rgba(243,196,81,.2);animation-delay:-11s}
@keyframes floaty{0%,100%{transform:translate3d(0,0,0) scale(1)}33%{transform:translate3d(4%,-5%,0) scale(1.09)}66%{transform:translate3d(-4%,4%,0) scale(.95)}}