/* V3.5 // finishing interaction layer: metrics, favorite, seasonal, footer */

/* REFRESH FIX // rotate glyph only, never the whole tactical button */
.feed-refresh.is-refreshing{animation:none!important;transform:none!important}
.feed-refresh__icon{display:inline-grid;place-items:center;width:1em;height:1em;line-height:1;transform-origin:50% 50%;will-change:transform}
.feed-refresh.is-refreshing .feed-refresh__icon{animation:refreshIconSpin .58s cubic-bezier(.3,.7,.4,1)}
@keyframes refreshIconSpin{to{transform:rotate(360deg)}}

/* SITE METRICS // small live-data console */
.site-metrics>span,.site-favorite{position:relative;isolation:isolate;overflow:hidden;transition:border-color .2s ease,background .2s ease,color .2s ease,box-shadow .2s ease,transform .16s ease}
.site-metrics>span::before,.site-favorite::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(100deg,transparent 0 30%,rgba(90,223,255,.13) 49%,transparent 68%);transform:translateX(-130%);opacity:0}
.site-metrics>span:hover,.site-favorite:hover{transform:translateY(-1px);border-color:rgba(90,223,255,.38);background:rgba(7,26,40,.76);box-shadow:0 0 15px rgba(90,223,255,.07)}
.site-metrics>span:hover::before,.site-favorite:hover::before{opacity:1;animation:metricSweep .62s ease both}
@keyframes metricSweep{to{transform:translateX(130%)}}
.site-metrics b{display:inline-block;min-width:1ch;transform-origin:50% 65%}
.site-metrics b.metric-updated{animation:metricTick .42s cubic-bezier(.18,.8,.2,1)}
@keyframes metricTick{0%{opacity:.45;transform:translateY(3px) scale(.88);filter:blur(1px)}55%{opacity:1;transform:translateY(-1px) scale(1.08);color:#dffaff;text-shadow:0 0 9px rgba(90,223,255,.45)}100%{transform:none;filter:none}}
.site-favorite svg{position:relative;z-index:2;transition:transform .24s cubic-bezier(.2,.8,.2,1),fill .2s,stroke .2s,filter .2s}
.site-favorite[aria-pressed="true"]{color:#ff7185!important;border-color:rgba(255,48,74,.48)!important;background:rgba(255,48,74,.07)!important;box-shadow:0 0 16px rgba(255,48,74,.08),inset 0 0 12px rgba(255,48,74,.025)}
.site-favorite[aria-pressed="true"] svg{fill:rgba(255,48,74,.34)!important;filter:drop-shadow(0 0 5px rgba(255,48,74,.45))}
.site-favorite.just-liked svg{animation:favoriteHeart .58s cubic-bezier(.18,.85,.22,1)}
.site-favorite.just-liked::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:12px;border:1px solid rgba(255,80,102,.7);border-radius:50%;transform:translate(-50%,-50%) scale(.35);pointer-events:none;animation:favoriteRing .64s ease-out both}
@keyframes favoriteHeart{0%{transform:scale(.72)}38%{transform:scale(1.42) rotate(-5deg)}68%{transform:scale(.95) rotate(3deg)}100%{transform:none}}
@keyframes favoriteRing{0%{opacity:.9;transform:translate(-50%,-50%) scale(.3)}100%{opacity:0;transform:translate(-50%,-50%) scale(4.1)}}

/* SEASONAL // classified standby module */
.seasonal--compact{position:relative;isolation:isolate;overflow:hidden;transition:border-color .24s ease,box-shadow .24s ease,background .24s ease,transform .22s cubic-bezier(.2,.8,.2,1)}
.seasonal--compact::before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:linear-gradient(180deg,#ff304a 0 43%,transparent 43% 54%,#58ddff 54% 100%);box-shadow:3px 0 12px rgba(255,48,74,.12),3px 0 18px rgba(90,223,255,.07);opacity:.75}
.seasonal--compact::after{content:"";position:absolute;z-index:0;inset:0;pointer-events:none;background:linear-gradient(105deg,transparent 0 39%,rgba(90,223,255,.06) 50%,rgba(255,48,74,.035) 54%,transparent 66%);transform:translateX(-65%);animation:seasonalStandbySweep 6.8s ease-in-out infinite}
.seasonal--compact>*{position:relative;z-index:1}
.seasonal--compact span::before{content:"●";display:inline-block;margin-right:8px;color:#ff536b;text-shadow:0 0 8px rgba(255,48,74,.48);animation:standbyLed 2.4s ease-in-out infinite}
.seasonal--compact strong{transition:color .2s,text-shadow .2s,letter-spacing .2s}
.seasonal--compact:hover{transform:translateY(-2px);border-color:rgba(90,223,255,.3);background:rgba(6,20,31,.72);box-shadow:0 10px 28px rgba(0,0,0,.24),0 0 18px rgba(90,223,255,.04)}
.seasonal--compact:hover strong{color:#d7f3ff;text-shadow:0 0 9px rgba(90,223,255,.22);letter-spacing:.105em}
@keyframes seasonalStandbySweep{0%,63%{transform:translateX(-68%);opacity:0}69%{opacity:.8}82%{opacity:.45}92%,100%{transform:translateX(70%);opacity:0}}
@keyframes standbyLed{0%,100%{opacity:.38;filter:brightness(.8)}50%{opacity:1;filter:brightness(1.35)}}

/* FOOTER // low-intensity SPD closing strip */
.mock-footer{position:relative;isolation:isolate;overflow:hidden;transition:border-color .24s ease,box-shadow .24s ease}
.mock-footer::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:linear-gradient(90deg,transparent 0 8%,rgba(90,223,255,.24) 24%,rgba(255,48,74,.42) 58%,rgba(90,223,255,.2) 78%,transparent 100%);background-size:170% 100%;animation:footerSignal 7.2s linear infinite;pointer-events:none}
.mock-footer::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(circle at 9% 50%,rgba(255,48,74,.035),transparent 19%),radial-gradient(circle at 52% 50%,rgba(90,223,255,.028),transparent 25%)}
@keyframes footerSignal{to{background-position:170% 0}}
.footer-mark strong{transition:text-shadow .25s,color .25s;animation:footerSpdPulse 5.8s ease-in-out infinite}
@keyframes footerSpdPulse{0%,100%{text-shadow:0 0 0 rgba(90,223,255,0)}42%{text-shadow:0 0 8px rgba(90,223,255,.12)}48%{text-shadow:-3px 0 7px rgba(255,48,74,.18),3px 0 7px rgba(90,223,255,.16)}54%{text-shadow:0 0 4px rgba(90,223,255,.08)}}
.mock-footer .footer-socials a{--brand-rgb:116,207,255;position:relative;isolation:isolate;transition:transform .18s cubic-bezier(.2,.8,.2,1),border-color .18s,color .18s,box-shadow .18s,background .18s}
.mock-footer .footer-socials a[data-platform="facebook"]{--brand-rgb:24,119,242}.mock-footer .footer-socials a[data-platform="instagram"]{--brand-rgb:225,48,108}.mock-footer .footer-socials a[data-platform="discord"]{--brand-rgb:88,101,242}.mock-footer .footer-socials a[data-platform="tiktok"]{--brand-rgb:37,244,238}.mock-footer .footer-socials a[data-platform="youtube"]{--brand-rgb:255,0,51}.mock-footer .footer-socials a[data-platform="locket"]{--brand-rgb:255,204,72}.mock-footer .footer-socials a[data-platform="mail"]{--brand-rgb:90,223,255}
.mock-footer .footer-socials a:hover,.mock-footer .footer-socials a:focus-visible{transform:translateY(-3px) scale(1.08);color:rgb(var(--brand-rgb));border-color:rgba(var(--brand-rgb),.5);background:rgba(var(--brand-rgb),.06);box-shadow:0 0 14px rgba(var(--brand-rgb),.14)}
.mock-footer .footer-socials a:hover svg,.mock-footer .footer-socials a:focus-visible svg{filter:drop-shadow(0 0 5px rgba(var(--brand-rgb),.55))}
.mock-footer #backToTop{position:relative;overflow:hidden;clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px);transition:transform .18s,border-color .18s,color .18s,box-shadow .18s!important}
.mock-footer #backToTop::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(105deg,transparent 0 35%,rgba(90,223,255,.13) 50%,transparent 65%);transform:translateX(-130%);transition:transform .36s ease}
.mock-footer #backToTop:hover{transform:translateY(-2px);border-color:rgba(90,223,255,.55);color:#dff9ff;box-shadow:0 0 14px rgba(90,223,255,.09)}
.mock-footer #backToTop:hover::before{transform:translateX(130%)}

/* enter-view finishing touch */
.seasonal--compact.fx-enter,.mock-footer.fx-enter{animation:finishEnter .62s cubic-bezier(.16,.8,.25,1) both}
@keyframes finishEnter{0%{opacity:.45;transform:translateY(8px);filter:brightness(.8)}58%{filter:brightness(1.08)}100%{opacity:1;transform:none;filter:none}}

body.reduced-motion .feed-refresh.is-refreshing .feed-refresh__icon,
body.reduced-motion .site-metrics b.metric-updated,
body.reduced-motion .site-favorite.just-liked svg,
body.reduced-motion .site-favorite.just-liked::after,
body.reduced-motion .seasonal--compact::after,
body.reduced-motion .seasonal--compact span::before,
body.reduced-motion .mock-footer::before,
body.reduced-motion .footer-mark strong,
body.reduced-motion .seasonal--compact.fx-enter,
body.reduced-motion .mock-footer.fx-enter{animation:none!important}
body.reduced-motion .site-metrics>span:hover,
body.reduced-motion .site-favorite:hover,
body.reduced-motion .seasonal--compact:hover,
body.reduced-motion .mock-footer .footer-socials a:hover,
body.reduced-motion .mock-footer #backToTop:hover{transform:none!important}

@media(max-width:700px){.seasonal--compact::after{display:none}.mock-footer::before{animation-duration:10s}.site-metrics>span:hover,.site-favorite:hover{transform:none}}