/* A separate experiment: Focus typography, one shared moving sphere. */
.signal-entrance .focus-index{width:52%;position:relative;z-index:3}
.signal-entrance .focus-row{grid-template-columns:24px minmax(0,1fr) 44px;gap:clamp(18px,1.8vw,42px)}
.signal-entrance .focus-preview{display:none}
.signal-entrance .focus-name{font-size:clamp(38px,4.5cqw,96px);max-width:13ch}
.signal-entrance .focus-description{font-size:clamp(12px,.82cqw,17px)}
.signal-entrance .focus-row.is-previewing .focus-name{color:var(--ink)}
.signal-entrance .focus-row.is-previewing:before{transform:scaleX(1)}
.signal-entrance .focus-row.is-previewing .focus-arrow{background:var(--ink);color:var(--bg);transform:rotate(45deg)}
.signal-stage{position:absolute;left:55%;right:2%;top:4%;bottom:9%;--pointer-y:12.5%;isolation:isolate}
.signal-target{position:absolute;inset:0;display:block;outline-offset:0!important;border-radius:50%;touch-action:pan-y}
.signal-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none;opacity:0;transition:opacity .5s}
.signal-ready .signal-canvas{opacity:1}
.signal-fallback{position:absolute;left:10%;top:50%;width:80%;aspect-ratio:1;object-fit:cover;border-radius:50%;transform:translateY(-50%);opacity:1;transition:opacity .5s;box-shadow:inset -30px -30px 80px #0008}
.signal-ready .signal-fallback{opacity:0}
.signal-orbit{position:absolute;width:93%;height:50%;top:25%;left:3.5%;border:1px solid var(--line);border-radius:50%;transform:rotate(-28deg);pointer-events:none}
.signal-marker{position:absolute;left:var(--pointer-x,1%);top:calc(18% + var(--pointer-y)*.64);font-size:clamp(30px,3vw,60px);line-height:1;transform:translateY(-50%) rotate(var(--marker-turn,0deg));transition:left .65s cubic-bezier(.22,.8,.2,1),top .65s cubic-bezier(.22,.8,.2,1),transform .65s cubic-bezier(.22,.8,.2,1);z-index:4;color:var(--ink);pointer-events:none}
.signal-caption{position:absolute;left:10%;right:10%;bottom:-3%;display:grid;grid-template-columns:1fr auto;gap:12px 20px;z-index:5}
.signal-index{grid-column:1/-1;font:11px monospace;color:var(--muted)}
.signal-title{font-size:clamp(18px,1.8vw,32px);letter-spacing:-.04em}.signal-enter{font-size:13px;align-self:center;color:var(--muted)}
.signal-target:hover .signal-enter{color:var(--ink)}
.signal-progress{position:absolute;bottom:-7%;left:10%;right:10%;height:1px;background:var(--line);overflow:hidden}
.signal-progress i{display:block;height:100%;background:var(--ink);transform-origin:left;transform:scaleX(0)}
@media(max-width:1200px) and (min-width:801px){.signal-entrance .focus-name{font-size:clamp(30px,4.5cqw,60px)}.signal-entrance .focus-row{gap:18px;grid-template-columns:16px minmax(0,1fr) 32px}.signal-caption{left:7%;right:7%}.signal-enter{font-size:11px}}
@media(max-width:800px){
 #category-stage.signal-entrance{padding-top:340px}
 .signal-entrance .focus-index{width:100%}
 .signal-entrance .focus-row{grid-template-columns:20px minmax(0,1fr) 36px;min-height:140px;padding:24px 0}
 .signal-entrance .focus-name{font-size:clamp(29px,7vw,48px);max-width:none;line-height:1.08}
 .signal-entrance .focus-description{font-size:12px;max-width:none;margin-top:9px}
 .signal-entrance .focus-end{position:static;flex-direction:column;height:auto;gap:14px;align-self:center}
 .signal-entrance .focus-number{margin-top:8px}
 .signal-stage{left:16px;right:16px;top:0;bottom:auto;height:300px}
 .signal-caption{bottom:0;left:10%;right:10%}.signal-index{display:none}.signal-title{font-size:18px}.signal-enter{font-size:12px}
 .signal-progress{bottom:-14px}.signal-marker{left:5%;font-size:30px}.signal-orbit{width:78%;left:11%;height:55%;top:19%}
 .signal-fallback{width:240px;left:50%;transform:translate(-50%,-50%)}
}
@media(prefers-reduced-motion:reduce){.signal-marker{transition:none}}
body[data-motion=paused] .signal-marker{transition:none}
