/* ==========================================================================
   Radar 扫描动画 —— 快盘搜索（2026-09-30 重设计）
   概念：搜索即雷达扫描 —— 波束绕圈扫过，网盘图标被扫到时点亮。
   结构：radar-disc(底盘) + radar-grid×3(网格环) + radar-cross(十字线)
         + radar-sweep(旋转波束) + radar-blip(回声点) + radar-center(品牌标)
         + radar-node×12(网盘图标，严格随波束点亮)
   ========================================================================== */

.orbit {
    position: relative;
    display: flex;
    justify-content: center;
    height: 348px;
    padding: 8px 30px 0;
    overflow: hidden;
}

.orbit-wrap {
    /* --T 为波束旋转周期，图标点亮延迟按角度与其严格同步（延迟 = 角度/360*T - T） */
    --T: 9s;
    --chip: 40px;
    --r-in: 96px;
    --r-out: 144px;
    --center: 64px;
    position: relative;
    flex: none;
    width: 340px;
    height: 340px;
}

/* 边缘柔化交给底盘自身的径向渐变（radar-disc），此处不再叠加遮罩，
   避免盖住外环图标（z-index 层叠问题） */

/* ---- 底盘：柔和径向光晕 + 外圈细边 ---- */
.radar-disc {
    position: absolute;
    inset: 0;
    border-radius: 50%;
    border: 1px solid rgba(82, 104, 255, 0.12);
    background: radial-gradient(circle at 50% 46%,
            rgba(82, 104, 255, 0.10),
            rgba(82, 104, 255, 0.045) 52%,
            rgba(168, 85, 247, 0.035) 68%,
            rgba(255, 255, 255, 0) 76%);
}

/* ---- 网格环（半径与图标环严格对齐：中心圈 / --r-in / --r-out） ---- */
.radar-grid {
    position: absolute;
    border-radius: 50%;
    border: 1px solid rgba(82, 104, 255, 0.10);
    pointer-events: none;
}

.radar-grid-1 { inset: calc(50% - var(--center) * 0.78); }
.radar-grid-2 { inset: calc(50% - var(--r-in)); }
.radar-grid-3 { inset: calc(50% - var(--r-out)); border-color: rgba(82, 104, 255, 0.15); }

/* ---- 十字线 ---- */
.radar-cross {
    position: absolute;
    inset: 0;
    border-radius: 50%;
    background:
        linear-gradient(to right,
            transparent calc(50% - 0.5px),
            rgba(82, 104, 255, 0.10) calc(50% - 0.5px),
            rgba(82, 104, 255, 0.10) calc(50% + 0.5px),
            transparent calc(50% + 0.5px)),
        linear-gradient(to bottom,
            transparent calc(50% - 0.5px),
            rgba(82, 104, 255, 0.10) calc(50% - 0.5px),
            rgba(82, 104, 255, 0.10) calc(50% + 0.5px),
            transparent calc(50% + 0.5px));
    pointer-events: none;
}

/* ---- 旋转波束：锥形渐变，亮边在前、尾迹在后 ---- */
.radar-sweep {
    position: absolute;
    inset: 3%;
    border-radius: 50%;
    background: conic-gradient(from 0deg,
            rgba(82, 104, 255, 0) 0deg,
            rgba(82, 104, 255, 0) 250deg,
            rgba(82, 104, 255, 0.05) 305deg,
            rgba(82, 104, 255, 0.16) 342deg,
            rgba(120, 140, 255, 0.34) 356deg,
            rgba(34, 211, 238, 0.55) 359.5deg,
            rgba(82, 104, 255, 0) 360deg);
    animation: radar-rotate var(--T) linear infinite;
    will-change: transform;
}

/* 波束前端的亮点（随波束移动） */
.radar-sweep::after {
    content: '';
    position: absolute;
    left: 50%;
    top: 1.5%;
    width: 9px;
    height: 9px;
    margin-left: -4.5px;
    border-radius: 50%;
    background: radial-gradient(circle,
            rgba(82, 104, 255, 0.95) 0%,
            rgba(82, 104, 255, 0.35) 45%,
            rgba(82, 104, 255, 0) 72%);
    filter: blur(0.5px);
}

@keyframes radar-rotate {
    from { transform: rotate(0deg); }
    to   { transform: rotate(360deg); }
}

/* ---- 回声点：波束扫过时短暂亮起 ---- */
.radar-blip {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 0;
    height: 0;
    transform: rotate(var(--a)) translateY(calc(-1 * var(--r)));
    pointer-events: none;
}

.radar-blip::after {
    content: '';
    position: absolute;
    left: -3px;
    top: -3px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #5268ff;
    box-shadow: 0 0 8px 1px rgba(82, 104, 255, 0.55);
    opacity: 0;
    animation: radar-blip var(--T) linear infinite;
    animation-delay: var(--d);
}

.radar-blip.b1 { --a: 72deg;  --d: -7.2s; --r: calc(var(--r-out) - 22px); }
.radar-blip.b2 { --a: 156deg; --d: -5.1s; --r: calc(var(--r-in) - 8px); }
.radar-blip.b3 { --a: 252deg; --d: -2.7s; --r: calc(var(--r-out) - 12px); }
.radar-blip.b4 { --a: 336deg; --d: -0.6s; --r: calc(var(--r-in) + 8px); }

@keyframes radar-blip {
    0%        { opacity: 0.95; transform: scale(1); }
    16%       { opacity: 0;    transform: scale(0.55); }
    100%      { opacity: 0;    transform: scale(0.55); }
}

/* ---- 中心品牌标 ---- */
.radar-center {
    position: absolute;
    left: 50%;
    top: 50%;
    width: var(--center);
    height: var(--center);
    margin: calc(var(--center) / -2) 0 0 calc(var(--center) / -2);
    border-radius: 50%;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 10px 26px rgba(82, 104, 255, 0.20), 0 0 0 8px rgba(255, 255, 255, 0.65);
    z-index: 3;
    animation: radar-center 4.5s ease-in-out infinite;
}

.radar-center::before {
    content: '';
    position: absolute;
    inset: -13px;
    border-radius: 50%;
    border: 1px dashed rgba(82, 104, 255, 0.22);
}

.radar-center img {
    width: 66%;
    height: 66%;
    object-fit: contain;
}

@keyframes radar-center {
    0%, 100% { transform: scale(1); }
    50%      { transform: scale(1.06); }
}

/* ---- 网盘节点：随波束点亮 ---- */
.radar-node {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 0;
    height: 0;
    transform: rotate(var(--a)) translateY(calc(-1 * var(--r))) rotate(calc(-1 * var(--a)));
}

.radar-node.in  { --r: var(--r-in); }
.radar-node.out { --r: var(--r-out); }

.radar-chip {
    position: absolute;
    left: 0;
    top: 0;
    width: var(--chip);
    height: var(--chip);
    margin: calc(var(--chip) / -2) 0 0 calc(var(--chip) / -2);
    border-radius: 50%;
    background: #fff;
    border: 1px solid rgba(82, 104, 255, 0.12);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 6px 14px rgba(15, 23, 42, 0.08);
    animation: radar-chip-ping var(--T) linear infinite;
    animation-delay: var(--d);
    will-change: transform;
}

.radar-chip img {
    width: 62%;
    height: 62%;
    object-fit: contain;
    display: block;
}

/* 0% = 波束恰好扫到，随后快速衰减回静息态 */
@keyframes radar-chip-ping {
    0% {
        transform: scale(1.22);
        opacity: 1;
        border-color: rgba(82, 104, 255, 0.60);
        box-shadow: 0 0 0 7px rgba(82, 104, 255, 0.16), 0 8px 20px rgba(82, 104, 255, 0.35);
    }
    11% {
        transform: scale(1.04);
        opacity: 0.94;
    }
    24%, 100% {
        transform: scale(0.94);
        opacity: 0.8;
        border-color: rgba(82, 104, 255, 0.12);
        box-shadow: 0 6px 14px rgba(15, 23, 42, 0.08);
    }
}

/* ---- 无障碍：减少动态 ---- */
@media (prefers-reduced-motion: reduce) {
    .radar-sweep,
    .radar-blip::after,
    .radar-center,
    .radar-chip {
        animation: none;
    }
}

/* ---- 移动端缩小 ---- */
@media only screen and (max-width: 767px) {
    .orbit {
        height: 254px;
        padding: 6px 15px 0;
        margin: 0 -15px;
    }

    .orbit-wrap {
        --chip: 28px;
        --r-in: 68px;
        --r-out: 102px;
        --center: 46px;
        width: 248px;
        height: 248px;
    }
}


/* ==========================================================================
   Scan 加载动画 —— 搜索进行中（2026-09-30 重设计）
   概念：与首页雷达呼应 —— 扩散波纹 + 旋转追逐的网盘节点 + 中心品牌标。
   结构：scan-wrap > scan-wave×3(扩散波纹) + scan-disc(底盘) + scan-core(品牌标)
         + scan-node×8(节点，--i 序号控制追逐相位)
   ========================================================================== */

.search-loading {
    height: 240px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 18px;
}

.scan-wrap {
    position: relative;
    width: 168px;
    height: 168px;
    flex: none;
}

/* 底盘 */
.scan-disc {
    position: absolute;
    inset: 22px;
    border-radius: 50%;
    background: radial-gradient(circle,
            rgba(82, 104, 255, 0.10),
            rgba(82, 104, 255, 0.04) 60%,
            rgba(255, 255, 255, 0) 72%);
}

/* 扩散波纹：从中心向外扩散后消失 */
.scan-wave {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 48px;
    height: 48px;
    margin: -24px 0 0 -24px;
    border-radius: 50%;
    border: 2px solid rgba(82, 104, 255, 0.45);
    opacity: 0;
    animation: scan-wave 2.4s ease-out infinite;
}

.scan-wave.w2 { animation-delay: .8s; }
.scan-wave.w3 { animation-delay: 1.6s; }

@keyframes scan-wave {
    0%   { transform: scale(0.6); opacity: 0.7; }
    70%  { opacity: 0.12; }
    100% { transform: scale(3.4); opacity: 0; }
}

/* 中心品牌标 */
.scan-core {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 46px;
    height: 46px;
    margin: -23px 0 0 -23px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 6px 18px rgba(82, 104, 255, 0.22), 0 0 0 6px rgba(255, 255, 255, 0.7);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
    animation: scan-core-pulse 2.4s ease-in-out infinite;
}

.scan-core img {
    width: 66%;
    height: 66%;
    object-fit: contain;
}

@keyframes scan-core-pulse {
    0%, 100% { transform: scale(1); }
    50%      { transform: scale(1.07); }
}

/* 节点环：8 个，顺时针逐个点亮（0.2s 间隔 × 8 = 1.6s 一轮，与 2.4s 波纹同域呼应） */
.scan-node {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 0;
    height: 0;
    transform: rotate(var(--a)) translateY(-70px) rotate(calc(-1 * var(--a)));
    pointer-events: none;
}

.scan-chip {
    position: absolute;
    left: 0;
    top: 0;
    width: 32px;
    height: 32px;
    margin: -16px 0 0 -16px;
    border-radius: 50%;
    background: #fff;
    border: 1px solid rgba(82, 104, 255, 0.12);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 3px 10px rgba(15, 23, 42, 0.08);
    animation: scan-chip 2.4s ease-in-out infinite;
    /* 负延迟回绕：保持"全程在周期内"，且点亮顺序 0→7 与顺时针角度一致 */
    animation-delay: calc((var(--i) - 8) * 0.2s);
}

.scan-chip img {
    width: 62%;
    height: 62%;
    object-fit: contain;
}

/* 负延迟从自身相位起跑：光标顺序 0→7 与顺时针角度一致 */
@keyframes scan-chip {
    0%   { transform: scale(1.16); border-color: rgba(82, 104, 255, 0.55); box-shadow: 0 0 0 5px rgba(82, 104, 255, 0.14), 0 4px 12px rgba(82, 104, 255, 0.3); }
    12%  { transform: scale(1); }
    30%, 100% { transform: scale(0.9); border-color: rgba(82, 104, 255, 0.12); box-shadow: 0 3px 10px rgba(15, 23, 42, 0.08); }
}

/* 文案 + 呼吸点 */
.scan-text {
    display: flex;
    align-items: center;
    gap: 2px;
    font-size: 14px;
    font-weight: 600;
    color: #4b5670;
    letter-spacing: .5px;
}

.scan-text .dots {
    display: inline-flex;
    gap: 3px;
    margin-left: 2px;
    padding-bottom: 2px;
}

.scan-text .dots i {
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #5268ff;
    opacity: .3;
    animation: scan-dot 1.2s ease-in-out infinite;
}

.scan-text .dots i:nth-child(2) { animation-delay: .2s; }
.scan-text .dots i:nth-child(3) { animation-delay: .4s; }

@keyframes scan-dot {
    0%, 100% { opacity: .3; transform: translateY(0); }
    40%      { opacity: 1;  transform: translateY(-2px); }
}

@media (prefers-reduced-motion: reduce) {
    .scan-wave,
    .scan-core,
    .scan-chip,
    .scan-text .dots i {
        animation: none;
    }
}

@media only screen and (max-width: 767px) {
    .search-loading { height: 210px; }
    .scan-wrap { width: 148px; height: 148px; }
    .scan-disc { inset: 20px; }
    .scan-node { transform: rotate(var(--a)) translateY(-60px) rotate(calc(-1 * var(--a))); }
}