/* 登录页安全通道视觉增强：只使用 transform、opacity 与背景位置，避免高开销滤镜。 */
.captcha-code{position:relative;min-height:48px;overflow:hidden;cursor:pointer;appearance:none;font:700 16px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.18em;color:#ff918d;text-shadow:0 0 10px rgba(255,91,85,.24);border:1px solid rgba(232,52,47,.42);border-radius:10px;background:linear-gradient(145deg,rgba(43,10,12,.96),rgba(19,9,10,.98));box-shadow:inset 0 1px 0 rgba(255,150,145,.08),inset 0 -8px 18px rgba(0,0,0,.16);transition:border-color .2s ease,box-shadow .2s ease,color .2s ease}
.captcha-code::before{content:"";position:absolute;inset:4px;border:1px solid rgba(255,84,78,.12);border-radius:6px;pointer-events:none}
.captcha-code:hover,.captcha-code:focus-visible{color:#ff918d;border-color:rgba(255,91,85,.82);box-shadow:inset 0 1px 0 rgba(255,176,171,.12),0 0 0 3px rgba(229,42,38,.09)}
.captcha-code:focus-visible{outline:none}

@media (min-width:1021px){
  .visual-zone{padding-left:13vw}
  .panel-main{left:24%;top:14%;width:clamp(225px,21vw,338px);z-index:3;opacity:1;--panel-depth:perspective(900px) rotateY(-4deg) rotate(-3deg) scale(1)}
  .panel-flow{left:58%;top:25%;width:clamp(184px,16vw,264px);z-index:2;opacity:.62;--panel-depth:perspective(900px) rotateY(-11deg) rotate(5deg) scale(.88)}
  .panel-range{left:38%;top:71%;width:clamp(150px,14vw,220px);z-index:1;opacity:.42;--panel-depth:perspective(900px) rotateY(10deg) rotate(-3deg) scale(.72)}
  .quant-mark{left:33%;top:35%;width:52%;height:39%;min-width:390px}
}

@media (prefers-reduced-motion:no-preference) and (min-width:1021px){
  .panel-main,.panel-flow,.panel-range{will-change:transform,opacity}
  .panel-main{animation:panel-float-main 10s ease-in-out infinite}
  .panel-flow{animation:panel-float-flow 12s ease-in-out infinite}
  .panel-range{animation:panel-float-range 11s ease-in-out infinite}
  @keyframes panel-float-main{0%,100%{transform:translateY(0) var(--panel-depth);opacity:1}50%{transform:translateY(-6px) var(--panel-depth);opacity:.96}}
  @keyframes panel-float-flow{0%,100%{transform:translateY(0) var(--panel-depth);opacity:.62}50%{transform:translateY(5px) var(--panel-depth);opacity:.72}}
  @keyframes panel-float-range{0%,100%{transform:translateY(0) var(--panel-depth);opacity:.42}50%{transform:translateY(-4px) var(--panel-depth);opacity:.52}}
}

/* 数据面板：扫描层、趋势点和波动节点均为装饰性动效，不承载实时行情。 */
.market-panel{overflow:hidden;transform-style:preserve-3d}
.market-panel::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,transparent 36%,rgba(255,96,91,.08) 48%,transparent 61%);background-size:220% 100%;opacity:.48}
.market-panel header,.market-panel footer,.chart-grid,.trend-lines,.range-bars{position:relative;z-index:1}
.chart-grid::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,transparent 0 42%,rgba(255,105,99,.24) 50%,transparent 58%);background-size:100% 240%;opacity:.58}
.trend-lines i::after{content:"";position:absolute;right:-3px;top:50%;width:6px;height:6px;border:1px solid rgba(255,205,201,.82);border-radius:50%;background:#ff5b56;box-shadow:0 0 0 3px rgba(255,74,68,.12),0 0 12px rgba(255,88,82,.75);transform:translateY(-50%)}
.range-bars i{position:relative;transform-origin:center bottom}
.range-bars i::after{content:"";position:absolute;left:50%;top:-4px;width:5px;height:5px;border-radius:50%;background:#ff8c87;box-shadow:0 0 10px rgba(255,94,88,.8);transform:translateX(-50%)}

/* 箭头成为信号通道：底层保持原图形，上层形成向右流动的网格和能量节点。 */
.speed{height:2px;opacity:.8}

/* 右侧认证舱：建立低角度纵深，保留所有原有输入和错误状态。 */
.access-zone{perspective:1400px}
.login-card{overflow:hidden;transform:rotateY(-2deg) rotateX(.5deg);transform-style:preserve-3d;transition:transform .35s ease,box-shadow .35s ease}
.login-card::after{content:"";position:absolute;z-index:0;inset:-40% -10%;background:linear-gradient(115deg,transparent 42%,rgba(255,120,115,.09) 50%,transparent 58%);pointer-events:none;transform:translateX(-34%) rotate(5deg)}
.login-card>*{position:relative;z-index:1}
.login-card:hover{transform:rotateY(0) rotateX(0) translateY(-3px);box-shadow:inset 0 0 0 1px rgba(0,0,0,.68),0 36px 82px rgba(0,0,0,.56),0 0 30px rgba(176,19,23,.09)}
.brand-mark{box-shadow:0 10px 24px rgba(122,10,13,.22),inset 0 1px 0 rgba(255,184,181,.14)}
.login-button{position:relative;overflow:hidden}
.login-button::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 34%,rgba(255,255,255,.28) 49%,transparent 63%);transform:translateX(-130%)}
.login-button:hover::after{transform:translateX(130%);transition:transform .5s ease}

@media (prefers-reduced-motion:no-preference){
  .market-panel::before{animation:panel-scan 7s linear infinite}
  .chart-grid::after{animation:chart-scan 4.8s linear infinite}
  .trend-lines i::after{animation:trend-node-pulse 2.6s ease-in-out infinite}
  .trend-lines i:nth-child(2)::after{animation-delay:.22s}.trend-lines i:nth-child(3)::after{animation-delay:.44s}.trend-lines i:nth-child(4)::after{animation-delay:.66s}.trend-lines i:nth-child(5)::after{animation-delay:.88s}.trend-lines i:nth-child(6)::after{animation-delay:1.1s}
  .range-bars i{animation:range-node-rise 3.7s ease-in-out infinite}
  .range-bars i:nth-child(2){animation-delay:.18s}.range-bars i:nth-child(3){animation-delay:.36s}.range-bars i:nth-child(4){animation-delay:.54s}.range-bars i:nth-child(5){animation-delay:.72s}.range-bars i:nth-child(6){animation-delay:.9s}.range-bars i:nth-child(7){animation-delay:1.08s}
  .orbit-wide{animation:orbit-breathe 4.6s ease-in-out infinite}
  .login-card{animation:login-card-breathe 6s ease-in-out infinite}
  @keyframes panel-scan{to{background-position:-220% 0}}
  @keyframes chart-scan{to{background-position:0 -240%}}
  @keyframes range-node-rise{0%,100%{opacity:.66;transform:scaleY(.92)}50%{opacity:1;transform:scaleY(1.06)}}
  @keyframes orbit-breathe{0%,100%{opacity:.72}50%{opacity:1}}
  @keyframes login-card-breathe{0%,100%{box-shadow:inset 0 0 0 1px rgba(0,0,0,.68),0 28px 70px rgba(0,0,0,.42)}50%{box-shadow:inset 0 0 0 1px rgba(0,0,0,.68),0 32px 76px rgba(0,0,0,.5),0 0 24px rgba(176,19,23,.08)}}
}

@media (prefers-reduced-motion:reduce){.market-panel,.market-panel::before,.chart-grid::after,.trend-lines i::after,.range-bars i,.orbit-wide,.login-card{animation:none!important}.login-card{transform:none}}
@media (max-width:1020px){.login-card{transform:none}.login-card:hover{transform:translateY(-2px)}}
/* A 方案：双层切面箭簇与信号核心。 */
.visual-zone::before{content:"";position:absolute;inset:9% 8% 8% 7%;pointer-events:none;background:linear-gradient(rgba(255,92,87,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,92,87,.035) 1px,transparent 1px);background-size:42px 42px;mask-image:radial-gradient(ellipse at 54% 52%,#000 0 34%,transparent 74%);opacity:.72}
.market-panel{border-color:rgba(255,106,100,.3);background:linear-gradient(145deg,rgba(48,14,16,.78),rgba(12,10,11,.92));box-shadow:inset 0 1px 0 rgba(255,220,218,.05),inset 12px 0 24px rgba(97,10,13,.08),0 16px 34px rgba(0,0,0,.14)}
.market-panel header::after{content:"";display:block;width:28px;height:1px;margin-left:auto;background:linear-gradient(90deg,transparent,rgba(255,113,107,.66))}
.market-panel footer{padding-top:2px;border-top:1px solid rgba(255,109,102,.08)}

/* 覆盖旧平面箭头，切面与核心由三个显式装饰层组成。 */
.signal-arrow{left:18%;top:34%;width:58%;height:39%;overflow:visible;isolation:isolate;background:none;clip-path:none;box-shadow:none}
.arrow-shell{position:absolute;z-index:1;inset:12% 1% 12% 0;clip-path:polygon(0 31%,52% 31%,52% 0,100% 50%,52% 100%,52% 69%,0 69%);background:linear-gradient(160deg,#ff8a82 0%,#f63235 24%,#ba0d14 62%,#570609 100%);box-shadow:inset 0 1px rgba(255,238,236,.78),inset 0 -12px 18px rgba(61,0,2,.24),0 16px 34px rgba(219,25,28,.3);transform:perspective(780px) rotateX(9deg) rotateY(-8deg)}
.arrow-shell::before{content:"";position:absolute;inset:5px;clip-path:polygon(0 32%,52% 32%,52% 0,100% 50%,52% 100%,52% 68%,0 68%);background:linear-gradient(90deg,rgba(91,0,4,.52),rgba(255,120,114,.2) 47%,rgba(88,0,4,.52));border:1px solid rgba(255,235,233,.28)}
.arrow-shell::after{content:"";position:absolute;left:0;top:50%;width:78%;height:1px;background:linear-gradient(90deg,rgba(255,244,242,.14),rgba(255,244,242,.92),transparent);box-shadow:0 -16px 0 rgba(255,236,234,.15),0 16px 0 rgba(255,236,234,.12);transform:translateY(-50%)}
.arrow-core{position:absolute;z-index:4;left:51%;top:50%;width:48px;height:48px;border:1px solid rgba(255,219,216,.86);background:radial-gradient(circle at 35% 30%,#fff8f7 0 5%,#ffb5b0 8%,#ef282b 34%,#630408 68%,#160406 100%);box-shadow:0 0 0 7px rgba(255,56,52,.1),0 0 28px rgba(255,65,59,.62),inset 0 0 14px rgba(255,239,237,.35);transform:translate(-50%,-50%) rotate(45deg)}
.arrow-core::before{content:"";position:absolute;inset:10px;border:1px solid rgba(255,244,243,.62);background:radial-gradient(circle,#fff8f7 0 11%,rgba(255,181,176,.56) 13%,transparent 48%)}
.arrow-core::after{content:"";position:absolute;left:50%;top:-12px;width:1px;height:70px;background:linear-gradient(transparent,rgba(255,230,228,.86),transparent);box-shadow:0 0 14px rgba(255,88,82,.72);transform:translateX(-50%) rotate(-45deg)}
.arrow-pulse{position:absolute;z-index:3;left:4%;top:50%;width:53%;height:16px;overflow:hidden;background:repeating-linear-gradient(90deg,rgba(255,240,238,.16) 0 5px,transparent 6px 17px);mask-image:linear-gradient(90deg,transparent,black 13%,black 87%,transparent);transform:translateY(-50%)}
.arrow-pulse::after{content:"";position:absolute;top:3px;left:0;width:10px;height:10px;border-radius:50%;background:#fff3f1;box-shadow:0 0 0 4px rgba(255,68,63,.18),0 0 18px rgba(255,89,83,.92)}
.signal-arrow i,.signal-arrow b,.signal-arrow em{z-index:2;left:7%;background:rgba(255,231,229,.63);mix-blend-mode:screen}
.signal-arrow i{top:38%;width:32%}.signal-arrow b{top:50%;width:42%}.signal-arrow em{top:62%;width:32%}
.orbit-wide{border-width:1px;border-color:rgba(255,94,88,.48);box-shadow:0 0 0 5px rgba(255,45,41,.035),0 0 24px rgba(231,37,34,.17)}
.orbit-narrow{border-color:rgba(255,131,125,.35)}
.speed-one{width:87%;background:linear-gradient(90deg,transparent,rgba(255,112,106,.6),transparent)}
.speed-two{width:72%;opacity:.7}

@media (prefers-reduced-motion:no-preference){
  .arrow-shell{animation:arrow-shell-hover 5.6s ease-in-out infinite}
  .arrow-core{animation:signal-core-rotate 5.2s linear infinite}
  .arrow-pulse{animation:arrow-particle-run 1.8s linear infinite}
  .arrow-pulse::after{animation:arrow-particle-head 1.8s linear infinite}
  .market-panel header::after{animation:panel-corner-glow 3.4s ease-in-out infinite}
  @keyframes arrow-shell-hover{0%,100%{transform:perspective(780px) rotateX(9deg) rotateY(-8deg) translateY(0)}50%{transform:perspective(780px) rotateX(7deg) rotateY(-5deg) translateY(-4px)}}
  @keyframes signal-core-rotate{to{transform:translate(-50%,-50%) rotate(405deg)}}
  @keyframes arrow-particle-run{to{background-position:64px 0}}
  @keyframes arrow-particle-head{to{transform:translateX(260px)}}
  @keyframes panel-corner-glow{0%,100%{opacity:.38;transform:scaleX(.7);transform-origin:right}50%{opacity:1;transform:scaleX(1);transform-origin:right}}
}

@media (prefers-reduced-motion:reduce){.arrow-shell,.arrow-core,.arrow-pulse,.arrow-pulse::after,.market-panel header::after{animation:none!important}.arrow-shell{filter:none}.arrow-core{transform:translate(-50%,-50%) rotate(45deg)}}
@media (max-width:1020px){.signal-arrow{left:18%;top:34%;width:58%;height:39%}.visual-zone::before{opacity:.4}}