.party-hat{
display:none;
position:absolute;
width:calc(var(--eye) * 1.4);
height:auto;
max-width:none;
max-height:none;
top:-46px;
left:37%;
transform:translateX(-50%) rotate(-7deg);
z-index:10;
pointer-events:none;
filter:drop-shadow(0 2px 3px rgba(0,0,0,0.3));
transition:top 0.1s ease,transform 0.1s ease;
}
[data-holiday="nye"] .party-hat,
[data-holiday="nyd"] .party-hat{
display:block;
}
.eye-wrapper:has(.walrus-eye.pressed) .party-hat{
top:calc(var(--eye) * -1);
transform:translateX(-50%) rotate(-6deg);
}
.party-hat.dance-stopping{
animation:party-hat-stop 0.15s ease-out forwards;
}
@keyframes party-hat-stop{
0%{transform:translateX(-50%) rotate(-7deg) scale(1);}
40%{transform:translateX(-50%) rotate(-7deg) scale(0.92);}
100%{transform:translateX(-50%) rotate(-7deg) scale(1);}
}
.nye-container{
position:fixed;
top:0;
left:0;
right:0;
bottom:0;
pointer-events:none;
z-index:0;
overflow:hidden;
}
.nye-countdown{
position:absolute;
font-family:'Dosis',sans-serif;
font-size:clamp(2rem,5vw,4rem);
font-weight:700;
color:var(--cl1);
opacity:0.15;
user-select:none;
pointer-events:none;
white-space:nowrap;
display:inline-block;
line-height:0.85;
padding:0;
margin:0;
}
.nye-countdown.nye-celebrate{
animation:nye-celebrate 2s ease-out forwards;
opacity:0;
}
@keyframes nye-celebrate{
0%{
transform:scale(0);
opacity:0;
}
50%{
transform:scale(1.2);
opacity:0.3;
}
100%{
transform:scale(1);
opacity:0.2;
}
}
@media(max-width:600px){
.nye-countdown{
font-size:clamp(1.5rem,4.5vw,2.5rem);
}
}
@media(prefers-reduced-motion:reduce){
.party-hat{
transition:none;
}
.party-hat.dance-stopping{
animation:none;
}
.nye-countdown.nye-celebrate{
animation:none;
opacity:0.2;
}
}