.fr-hero { background: #3B55D9; cursor: crosshair; }
.fr-blob { position: absolute; left: 0; top: 0; border-radius: 50%; pointer-events: none; will-change: transform; }
.fr-o { width: max(46vw, 360px); max-width: 720px; aspect-ratio: 1; background: #FF5A1F; filter: blur(clamp(60px, 7.5vw, 110px)); transform: translate(28vw, 60%) translate(-50%, -50%); }
.fr-v { width: max(40vw, 300px); aspect-ratio: 4 / 3; background: #9A7BE0; filter: blur(clamp(70px, 8vw, 120px)); opacity: .7; transform: translate(80vw, 20%) translate(-50%, -50%); }
.fr-hit { position: absolute; inset: 0; width: 100%; height: 100%; background: none; border: 0; cursor: crosshair; z-index: 1; }
.fr-title { margin: 0; font-weight: 300; font-size: clamp(72px, 12vw, 184px); line-height: .85; letter-spacing: -.05em; color: #fff; }
.fr-ring { position: absolute; width: 16px; height: 16px; margin: -8px 0 0 -8px; border: 1px solid #fff; border-radius: 50%; pointer-events: none; z-index: 2; animation: ring 1.2s var(--ease) forwards; }
@keyframes ring { to { transform: scale(9); opacity: 0; } }
.r-fly-room .trk .st { color: #FF7A45; opacity: 1; }
.r-fly-room .trk[aria-pressed="true"] .t { color: #FF7A45; }