/* ==========================================================================
   极垣车队 POLARVEX · 全站加载动画
   参照 jhcd.html 高保真移植：结构 / 关键帧 / 配色 / 时序 / 响应式 1:1 还原
   说明：所有类名统一加 pv- 前缀并限制在 .pv-loader 作用域内，
        避免与 assets/css/style.css 的既有选择器互相污染。
   ========================================================================== */

.pv-loader{
    position:fixed;
    inset:0;
    z-index:9999;
    display:grid;
    place-items:center;
    overflow:hidden;
    color:#f4f7fc;
    background:
        radial-gradient(ellipse at 50% 43%,rgba(67,83,108,.38),transparent 34%),
        radial-gradient(ellipse at 50% 100%,#111722 0%,#080a0f 60%);
    font-family:Inter,"Microsoft YaHei","PingFang SC",sans-serif;
    -webkit-tap-highlight-color:transparent;
    transition:opacity .75s ease,visibility .75s ease;
}
.pv-loader.is-done{opacity:0;visibility:hidden;pointer-events:none}

/* 加载期间锁定页面滚动，淡出后由脚本移除 */
html.pv-loading,
html.pv-loading body{overflow:hidden}

.pv-scene{width:min(92vw,520px);text-align:center;position:relative;padding:34px 0}

/* ---------------- 视觉主体 ---------------- */
.pv-visual{
    width:270px;height:270px;
    max-width:65vw;max-height:65vw;
    position:relative;margin:0 auto 34px;
    display:grid;place-items:center;
}
.pv-logo-shell{
    position:absolute;inset:38px;border-radius:50%;overflow:hidden;
    transform-style:preserve-3d;
    animation:pvLogoSpin 7s cubic-bezier(.45,.05,.55,.95) infinite;
}
.pv-logo{
    width:100%;height:100%;object-fit:cover;border-radius:50%;display:block;
    filter:contrast(1.08) brightness(.93);
    box-shadow:0 0 35px #8abaff22;
}
.pv-logo-shell:after{
    content:"";position:absolute;inset:0;
    background:linear-gradient(115deg,transparent 28%,#d9e9ff00 39%,#e8f4ffb8 49%,#d9e9ff00 58%,transparent 70%);
    mix-blend-mode:screen;
    animation:pvSweep 3.6s ease-in-out infinite;
}

.pv-orbit{
    position:absolute;border-radius:50%;inset:12px;
    border:1px solid #bcd5ff35;
    transform:rotateX(68deg) rotateZ(0deg);
    box-shadow:0 0 20px #79aaff12;
    animation:pvOrbitA 5s linear infinite;
}
.pv-orbit.two{inset:2px;border-color:#c7d8f51c;transform:rotateX(68deg) rotateZ(65deg);animation:pvOrbitB 7s linear infinite}
.pv-orbit.three{inset:26px;border:1px dashed #b6d1ff3b;transform:rotateX(68deg) rotateZ(0deg);animation:pvOrbitA 11s linear infinite reverse}

.pv-ring{
    position:absolute;inset:0;border-radius:50%;
    background:conic-gradient(from 0deg,transparent 0 45%,#6fa8ff00 54%,#8cbaff 68%,#f0f7ff 72%,#76aaff 76%,transparent 88% 100%);
    -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:pvOrbitA 2.4s linear infinite;
    filter:drop-shadow(0 0 5px #83b6ff88);
}
.pv-ring.inner{inset:23px;opacity:.65;animation:pvOrbitB 3.7s linear infinite}
.pv-ring:before{
    content:"";position:absolute;left:50%;top:-2px;width:5px;height:5px;border-radius:50%;
    background:#eff7ff;box-shadow:0 0 12px 4px #8bbaff;transform:translateX(-50%);
}
.pv-core-glow{
    position:absolute;inset:48px;border-radius:50%;
    background:#78aaff0b;
    box-shadow:0 0 55px #73a8ff15,inset 0 0 20px #b7d5ff0b;
    pointer-events:none;
}

/* ---------------- 文案与进度 ---------------- */
.pv-loader h1{
    font-size:30px;letter-spacing:.34em;padding-left:.34em;margin:0;
    font-weight:650;
    text-shadow:0 0 22px #b8d4ff24;
}
.pv-loader .en{
    margin-top:10px;color:#9aa8bc;font-size:10px;
    letter-spacing:.42em;padding-left:.42em;
}
.pv-loader .loading{
    margin:36px 0 13px;color:#c4d0e2;font-size:12px;
    letter-spacing:.28em;padding-left:.28em;
}
.pv-loader .loading span{display:inline-block;animation:pvPulse 1.2s ease-in-out infinite}
.pv-loader .loading span:nth-child(2){animation-delay:.15s}
.pv-loader .loading span:nth-child(3){animation-delay:.3s}
.pv-loader .progress{
    width:190px;height:2px;margin:0 auto;
    background:#d7e5ff18;overflow:hidden;position:relative;
}
.pv-loader .progress:after{
    content:"";position:absolute;inset:0 auto 0 -45%;width:45%;
    background:linear-gradient(90deg,transparent,#7fb3ff,#f1f7ff,transparent);
    box-shadow:0 0 12px #85b5ff;
    animation:pvProgress 1.8s ease-in-out infinite;
}
.pv-loader .caption{margin-top:18px;color:#566275;font-size:9px;letter-spacing:.3em}

/* ---------------- 关键帧（与参考文件完全一致） ---------------- */
@keyframes pvLogoSpin{
    0%{transform:rotateY(0deg) rotateZ(0deg)}
    50%{transform:rotateY(180deg) rotateZ(3deg)}
    100%{transform:rotateY(360deg) rotateZ(0deg)}
}
@keyframes pvSweep{
    0%,100%{transform:translateX(-120%);opacity:0}
    25%{opacity:.9}
    60%{transform:translateX(120%);opacity:.35}
}
@keyframes pvOrbitA{to{transform:rotateX(68deg) rotateZ(360deg)}}
@keyframes pvOrbitB{to{transform:rotateX(68deg) rotateZ(-360deg)}}
@keyframes pvProgress{to{transform:translateX(430%)}}
@keyframes pvPulse{
    0%,80%,100%{opacity:.28;transform:translateY(0)}
    40%{opacity:1;transform:translateY(-2px)}
}

/* ---------------- 响应式 / 无障碍 ---------------- */
@media(max-width:420px){
    .pv-visual{width:230px;height:230px}
    .pv-logo-shell{inset:34px}
    .pv-loader h1{font-size:25px}
}
@media(prefers-reduced-motion:reduce){
    .pv-loader *,
    .pv-loader *:before,
    .pv-loader *:after{animation-duration:.01ms!important;animation-iteration-count:1!important}
}
