.idle-hype-overlay { position: fixed; inset: 0; z-index: 23; pointer-events: none; overflow: hidden; contain: layout paint; opacity: 0; transition: opacity .25s ease; }
.idle-hype-overlay[data-active="1"] { opacity: 1; }
.idle-hype-overlay[data-active="1"]::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 50% 35%, #fff4c51c, transparent 48%), radial-gradient(circle at 12% 72%, #f5b4d014, transparent 32%); opacity: .7; }
.idle-hype-character { position: absolute; left: clamp(10px, 8vw, 120px); bottom: clamp(4px, 4vh, 32px); color: #f8c94f; font-size: clamp(2rem, 7vw, 5rem); text-shadow: 0 3px 0 #bd6d9a66, 0 0 18px #ffe99c; opacity: 0; transform: scale(.7) rotate(-12deg); }
.idle-hype-character, .idle-hype-friend { width: clamp(54px, 11vw, 108px); aspect-ratio: 1; background-size: 200% 200%; background-position: 0 0; background-repeat: no-repeat; filter: drop-shadow(0 5px 5px #57386b44); }
.idle-hype-friend { position: absolute; right: clamp(10px, 8vw, 120px); bottom: clamp(4px, 4vh, 32px); opacity: 0; transform: scale(.7) rotate(12deg); }
.idle-hype-overlay[data-idle-stage="1"] .idle-hype-character { opacity: .8; animation: idle-hype-breathe 1.3s ease-in-out var(--idle-actor-delay, 0ms) infinite; }
.idle-hype-overlay[data-idle-stage="2"] .idle-hype-character, .idle-hype-overlay[data-idle-stage="3"] .idle-hype-character { opacity: .9; animation: idle-hype-peek .78s cubic-bezier(.2,1.4,.4,1) var(--idle-actor-delay, 0ms) infinite; }
.idle-hype-message { position: absolute; left: 50%; top: clamp(12%, 18vh, 25%); transform: translateX(-50%) scale(.9); color: #734b93; background: #fff9eede; border: 2px solid #f0b3cf; border-radius: 999px; padding: .3rem .8rem; font-weight: 900; font-size: clamp(.9rem, 2.5vw, 1.3rem); opacity: 0; white-space: nowrap; box-shadow: 0 4px 16px #8b5b9a22; }
.idle-hype-message[data-safe-hidden="1"] { opacity: 0 !important; visibility: hidden; }
.idle-hype-message[data-placement="side"] { transform: none; animation: none !important; }
.idle-hype-overlay[data-idle-stage="2"] .idle-hype-message, .idle-hype-overlay[data-idle-stage="3"] .idle-hype-message { opacity: 1; animation: idle-hype-message 1.8s ease-in-out infinite; }
.idle-hype-orbit { position: absolute; width: clamp(10px, 2vw, 24px); aspect-ratio: 1; border-radius: 50%; background: #ffd66e; box-shadow: 0 0 12px #fff0a8; opacity: 0; }
.idle-hype-orbit-a { left: 22%; top: 8%; } .idle-hype-orbit-b { right: 23%; top: 12%; background: #f69fc5; } .idle-hype-orbit-c { left: 50%; top: 16%; background: #9bdde0; }
.idle-hype-overlay[data-idle-stage="2"] .idle-hype-orbit { opacity: .9; animation: idle-hype-orbit 2.3s ease-in-out var(--idle-decor-delay, 0ms) infinite; }
.idle-hype-overlay[data-idle-stage="3"] .idle-hype-orbit { opacity: 1; animation: idle-hype-orbit-fast 1.1s ease-in-out var(--idle-decor-delay, 0ms) infinite; }
.idle-hype-overlay[data-idle-stage="3"] .idle-hype-friend { opacity: .82; animation: idle-hype-friend-pop 1.05s cubic-bezier(.2,1.3,.4,1) var(--idle-actor-delay, 0ms) infinite; }
.idle-hype-choice-accent { position: absolute; inset: 5px; border-radius: inherit; pointer-events: none; opacity: 0; border: 2px solid #f5cf72; box-shadow: 0 0 10px #ffeaa980; }
.idle-hype-stage-2 .idle-hype-choice-accent, .idle-hype-stage-3 .idle-hype-choice-accent { animation: idle-hype-choice-pop 1.6s ease-in-out var(--idle-delay) infinite; }
.idle-hype-trail { position: absolute; pointer-events: none; opacity: 0; color: #f6c75d; font-size: clamp(14px, 3vw, 26px); text-shadow: 0 0 10px #fff0a8; }
.idle-hype-trail-a { left: 8%; top: 22%; } .idle-hype-trail-b { right: 8%; top: 26%; color: #f398c1; } .idle-hype-trail-c { left: 12%; top: 30%; color: #9ddce0; } .idle-hype-trail-d { right: 14%; top: 34%; color: #f4bf63; }
.idle-hype-overlay[data-idle-stage="2"] .idle-hype-trail { opacity: .8; animation: idle-hype-trail 2.1s ease-in-out var(--idle-decor-delay, 0ms) infinite; }
.idle-hype-overlay[data-idle-stage="3"] .idle-hype-trail { opacity: 1; animation: idle-hype-trail-fast 1.25s ease-in-out var(--idle-decor-delay, 0ms) infinite; }
.idle-hype-overlay[data-idle-stage="3"] .idle-hype-orbit-a { transform: translateX(-18vw); } .idle-hype-overlay[data-idle-stage="3"] .idle-hype-orbit-b { transform: translateX(18vw); }
@keyframes idle-hype-breathe { 0%,100% { transform: scale(.92) rotate(-4deg); } 50% { transform: translateY(-9px) scale(1.02) rotate(5deg); } }
@keyframes idle-hype-peek { 0%,100% { transform: translateY(3px) scale(.96) rotate(-5deg); } 45% { transform: translateY(-14px) scale(1.05) rotate(7deg); } }
@keyframes idle-hype-friend-pop { 0%,100% { transform: translateY(3px) scale(.84) rotate(8deg); } 40% { transform: translateY(-16px) scale(1.04) rotate(-8deg); } 62% { transform: translateY(-8px) scale(.95) rotate(3deg); } }
@keyframes idle-hype-message { 0%,100% { transform: translateX(-50%) scale(.96); } 50% { transform: translateX(-50%) scale(1.04); } }
@keyframes idle-hype-orbit { 0%,100% { transform: translate(0,0) scale(.7); } 50% { transform: translate(4vw,-2vh) scale(1.15); } }
@keyframes idle-hype-orbit-fast { 0% { transform: translate(-3vw,2vh) scale(.7) rotate(0); } 50% { transform: translate(4vw,-3vh) scale(1.2) rotate(120deg); } 100% { transform: translate(-2vw,1vh) scale(.8) rotate(240deg); } }
@keyframes idle-hype-choice-pop { 0%,100% { opacity: 0; transform: scale(.98); } 35%,65% { opacity: .55; transform: scale(1.02); } }
@keyframes idle-hype-trail { 0%,100% { transform: translate(0,6px) rotate(-12deg) scale(.7); } 50% { transform: translate(8px,-12px) rotate(18deg) scale(1.1); } }
@keyframes idle-hype-trail-fast { 0% { transform: translate(-4px,8px) rotate(0) scale(.7); } 50% { transform: translate(10px,-18px) rotate(120deg) scale(1.15); } 100% { transform: translate(-8px,2px) rotate(240deg) scale(.8); } }
@media (prefers-reduced-motion: reduce) { .idle-hype-overlay { display: none; } }
.manual-reduced-motion .idle-hype-overlay { display: none; }