.explore-body{
    --stage-h:max(520px,calc(100vh - 96px));
    --stage-h:max(520px,calc(100dvh - 96px));
}

@keyframes spin{to{transform:rotate(-360deg)}}
@keyframes spinR{to{transform:rotate(360deg)}}
@keyframes ringPulse{0%{transform:scale(.3);opacity:0}26%{opacity:.6}100%{transform:scale(1);opacity:0}}
.core-title{animation:rise .9s .1s var(--ease) both}
.core-sub{animation:rise .9s .18s var(--ease) both}
.controls{animation:rise .9s .3s var(--ease) both}

.stage-core{
    position:absolute;inset:0;margin:auto;
    width:max-content;height:max-content;
    display:flex;flex-direction:column;align-items:center;justify-content:center;
    padding:40px 76px;text-align:center;pointer-events:none;
    background:radial-gradient(50% 46% at 50% 50%,rgba(250,250,250,.96) 34%,rgba(250,250,250,.72) 60%,rgba(250,250,250,0) 82%);
}
.core-title{
    font-size:clamp(34px,4.6vw,54px);font-weight:300;line-height:1.12;
    letter-spacing:.42em;text-indent:.42em;color:var(--ink);
}
.core-sub{margin-top:12px;font-size:13.5px;color:var(--sub);letter-spacing:.05em}

.controls{
    display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:12px;
    margin-top:24px;position:relative;z-index:6;pointer-events:auto;
}
.btn-main{
    display:inline-flex;align-items:center;gap:8px;
    background:var(--ink);color:#fff;border-radius:12px;padding:10px 26px;
    font-size:14px;font-weight:500;letter-spacing:.08em;
    transition:background .25s var(--ease),transform .25s var(--ease);
}
.btn-main:hover{background:#334155;transform:translateY(-1px)}
.btn-main:active{transform:translateY(0) scale(.985)}
.btn-main svg,.btn-ghost svg{width:15px;height:15px}
.btn-ghost{
    display:inline-flex;align-items:center;gap:8px;
    border:1px solid var(--line-2);border-radius:12px;padding:10px 26px;
    font-size:14px;font-weight:500;letter-spacing:.08em;color:var(--ink-soft);
    transition:border-color .25s var(--ease),color .25s var(--ease),transform .25s var(--ease);
}
.btn-ghost:hover{border-color:var(--muted);color:var(--ink);transform:translateY(-1px)}
.btn-ghost:active{transform:translateY(0) scale(.985)}

.stage{
    position:relative;height:var(--stage-h);margin-top:20px;overflow:hidden;
    border-radius:16px;
    background:radial-gradient(46% 52% at 50% 50%,rgba(59,130,246,.05),transparent 72%);
}
.fx,.array{position:absolute;left:0;right:0;top:0;bottom:0;width:100%;height:100%;pointer-events:none}
.array .layer{animation:spin 60s linear infinite;transform-origin:600px 600px;will-change:transform}
.array .wave{animation:spinR 100s linear infinite;transform-origin:600px 600px;will-change:transform}
.array .pulse{transform-origin:600px 600px;opacity:0;pointer-events:none}
.array{opacity:.95;transition:opacity .8s var(--ease)}
.array.burst{opacity:1}
.tags{position:absolute;left:0;right:0;top:0;bottom:0;overflow:hidden;border-radius:16px}

.tag{
    position:absolute;left:0;top:0;
    display:inline-flex;align-items:center;gap:6px;padding:7px 13px;border-radius:999px;
    background:var(--surface);border:1px solid var(--line);
    color:var(--sub);font-size:13px;font-weight:500;line-height:1;white-space:nowrap;
    transform:translate(-50%,-50%);
    user-select:none;
    will-change:transform;
    transition:border-color .25s var(--ease),color .25s var(--ease),background .25s var(--ease),transform .2s var(--ease);
}
.tag .dot{
    position:absolute;left:-3.5px;top:50%;width:6px;height:6px;margin-top:-3px;
    border-radius:50%;background:var(--line-2);
    transition:background .25s var(--ease),transform .25s var(--ease);
}
.tag:hover{border-color:#BFDBFE;color:var(--accent-deep);background:#FBFDFF;transform:translate(-50%,-50%) scale(1.06)}
.tag:hover .dot{background:var(--accent);transform:scale(1.25)}
.tag.hit{border-color:#93C5FD;color:var(--accent-deep);background:#F5FAFF}

.tag.pl{animation:pulse .9s var(--ease)}
@keyframes pulse{
    0%{box-shadow:0 0 0 0 rgba(59,130,246,.30);background:#F3F9FF;border-color:#93C5FD}
    100%{box-shadow:0 0 0 14px rgba(59,130,246,0);background:var(--surface);border-color:var(--line)}
}
.tag.sc{z-index:6;color:var(--accent-deep);border-color:#BFDBFE;background:#F5FAFF;animation:none}

.overlay{
    position:fixed;inset:0;z-index:90;display:flex;align-items:center;justify-content:center;padding:24px;
    background:rgba(250,250,250,.62);
    backdrop-filter:blur(7px) saturate(1.1);-webkit-backdrop-filter:blur(7px) saturate(1.1);
    opacity:0;visibility:hidden;transition:opacity .35s var(--ease),visibility .35s;
}
.overlay.on{opacity:1;visibility:visible}
.sign{
    position:relative;display:flex;flex-direction:column;align-items:center;gap:22px;
    padding:30px 20px;max-width:min(92vw,540px);
    transform:translateY(30px) scale(.9);filter:blur(7px);
    transition:transform .62s var(--ease),filter .62s var(--ease);
}
.overlay.on .sign{transform:translateY(0) scale(1);filter:blur(0)}
.sign::after{
    content:'';position:absolute;inset:-16% -30%;z-index:-1;
    background:radial-gradient(50% 50% at 50% 42%,rgba(59,130,246,.13),transparent 70%);
    pointer-events:none;
}
.sign .beam{
    position:absolute;left:26%;right:26%;top:-120px;height:58%;z-index:-1;pointer-events:none;
    background:linear-gradient(rgba(59,130,246,0),rgba(59,130,246,.07) 70%,rgba(59,130,246,0));
    clip-path:polygon(44% 0,56% 0,78% 100%,22% 100%);
    transform-origin:50% 0;
}
.overlay.on .sign .beam{animation:beamDrop .8s var(--ease) both}
@keyframes beamDrop{from{opacity:0;transform:translateY(-34px) scaleY(.7)}to{opacity:1;transform:none}}
.sign .ring{position:absolute;width:min(74vw,470px);height:min(74vw,470px);z-index:-1;pointer-events:none;
    --r0:0deg;rotate:var(--r0);animation:spinRot 46s linear infinite}
.sign-card{
    position:relative;display:flex;flex-direction:column;align-items:center;
    padding:30px 40px 26px;border-radius:18px;background:var(--surface);border:1px solid var(--line);
    text-align:center;min-width:min(86vw,380px);max-width:100%;
}
.sign-card::before{
    content:'';position:absolute;inset:7px;border:1px dashed var(--line);border-radius:12px;pointer-events:none;
}
.sc-cat{
    font-size:11px;letter-spacing:.34em;text-indent:.34em;color:var(--muted);
    padding:3px 12px;border:1px solid var(--line);border-radius:999px;
}
.sc-name{
    margin-top:18px;font-size:clamp(24px,4.2vw,32px);font-weight:300;letter-spacing:.28em;text-indent:.28em;
    color:var(--ink);line-height:1.25;max-width:100%;overflow:hidden;text-overflow:ellipsis;
}
.sc-host{margin-top:9px;font-size:12.5px;color:var(--muted);letter-spacing:.04em}
.sc-line{width:52px;height:1px;background:var(--line-2);margin:18px 0 20px}
.sc-acts{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:center}
.controls .btn-main:disabled,.controls .btn-ghost:disabled{opacity:.5;pointer-events:none;cursor:default}
.tag.vac{border-color:#93C5FD;background:#F0F7FF;color:var(--accent-deep);
    box-shadow:0 0 0 5px rgba(59,130,246,.16),0 8px 22px -8px rgba(59,130,246,.55)}
.sign-card::after{
    content:'';position:absolute;inset:0;border-radius:18px;pointer-events:none;opacity:0;
    background:linear-gradient(105deg,transparent 36%,rgba(59,130,246,.1) 47%,rgba(255,255,255,.62) 52%,transparent 64%);
    background-size:250% 100%;background-position:130% 0;
}
.sign-card.settle{animation:settle .85s var(--ease)}
.sign-card.settle::after{animation:sweep .95s var(--ease)}
@keyframes settle{
    0%{box-shadow:0 0 0 0 rgba(59,130,246,0)}
    30%{box-shadow:0 0 0 5px rgba(59,130,246,.13),0 18px 44px -20px rgba(59,130,246,.4)}
    100%{box-shadow:0 0 0 0 rgba(59,130,246,0)}
}
@keyframes sweep{
    0%{opacity:0;background-position:130% 0}
    18%{opacity:1}
    100%{opacity:0;background-position:-70% 0}
}
@keyframes spinRot{to{rotate:calc(var(--r0,0deg) - 360deg)}}
.btn-sm-main,.btn-sm-ghost{
    display:inline-flex;align-items:center;gap:7px;border-radius:10px;padding:8px 18px;
    font-size:13px;font-weight:500;letter-spacing:.06em;
    transition:background .25s var(--ease),border-color .25s var(--ease),color .25s var(--ease);
}
.btn-sm-main{background:var(--ink);color:#fff}
.btn-sm-main:hover{background:#334155}
.btn-sm-ghost{border:1px solid var(--line-2);color:var(--sub)}
.btn-sm-ghost:hover{border-color:var(--muted);color:var(--ink)}
.btn-sm-main svg,.btn-sm-ghost svg{width:14px;height:14px}

@media (max-width:720px){
    .explore-body{
        --stage-h:max(440px,calc(100vh - 96px));
        --stage-h:max(440px,calc(100dvh - 96px));
    }
    .stage-core{padding:34px 52px}
    .core-title{letter-spacing:.34em;text-indent:.34em}
    .core-sub{font-size:11.5px;letter-spacing:.03em}
    .tag{padding:5px 10px;font-size:12px}
    .overlay{padding:16px}
    .sign{padding:20px 8px;gap:16px}
    .sign-card{padding:26px 24px 22px}
}
@media (max-width:560px){
    .btn-main,.btn-ghost{padding:9px 20px;font-size:13.5px}
}
