/* PG Decorations */
.pgDecor{position:static}
.pgDecor__canvas{position:fixed;inset:0;width:100vw;height:100vh;pointer-events:none;z-index:4000}
.pgDecor__layer{position:absolute;inset-inline:0;top:0;height:0;pointer-events:none;z-index:4001}
.pgDecor__fixed{position:fixed;pointer-events:none;z-index:3999}
html.pgDecor-off .pgDecor__canvas,html.pgDecor-off .pgDecor__layer,html.pgDecor-off .pgDecor__fixed,html.pgDecor-off .pgDecor__cap{display:none!important}

/* ---------- garland: lights ---------- */
.pgDecor__lights{position:absolute;top:0;left:0;width:100%;height:46px;overflow:hidden}
.pgDecor__lights svg{display:block;height:46px;overflow:visible}
.pgDecor__bulb{animation:pgdGlow 2.4s ease-in-out infinite}
.pgDecor__bulb:nth-of-type(3n+2){animation-delay:.8s}
.pgDecor__bulb:nth-of-type(3n){animation-delay:1.6s}
@keyframes pgdGlow{0%,100%{opacity:1;filter:drop-shadow(0 0 5px var(--c))}50%{opacity:.45;filter:none}}

/* ---------- garland: bunting ---------- */
.pgDecor__bunting{position:absolute;top:0;left:0;width:100%;height:60px;overflow:hidden}
.pgDecor__bunting svg{display:block;height:60px}
.pgDecor__flag{transform-box:fill-box;transform-origin:50% 0;animation:pgdFlag 3.2s ease-in-out infinite}
.pgDecor__flag:nth-of-type(2n){animation-delay:-1.4s}
@keyframes pgdFlag{0%,100%{transform:rotate(-3deg)}50%{transform:rotate(3deg)}}

/* ---------- garland: cobwebs + spider ---------- */
.pgDecor__web{position:absolute;top:0;width:min(170px,24vw);height:min(170px,24vw);color:rgba(70,75,90,.5)}
html[data-ips-scheme="dark"] .pgDecor__web{color:rgba(230,230,240,.38)}
.pgDecor__web--start{left:0}
.pgDecor__web--end{right:0;transform:scaleX(-1)}
.pgDecor__web svg{width:100%;height:100%;display:block;overflow:hidden}
.pgDecor__spider{position:absolute;top:0;right:min(110px,15vw);width:2px;transform-origin:50% 0;animation:pgdDangle 7s ease-in-out infinite}
.pgDecor__spider::before{content:"";position:absolute;top:0;left:0;width:1px;height:var(--len,140px);background:rgba(90,90,100,.6);animation:pgdThread 9s ease-in-out infinite}
html[data-ips-scheme="dark"] .pgDecor__spider::before{background:rgba(230,230,240,.5)}
.pgDecor__spider img{position:absolute;left:-15px;width:30px;top:calc(var(--len,140px) - 4px);animation:pgdDrop 9s ease-in-out infinite}
html[data-ips-scheme="dark"] .pgDecor__spider img{filter:drop-shadow(0 0 2px rgba(255,255,255,.6))}
@keyframes pgdDangle{0%,100%{transform:rotate(4deg)}50%{transform:rotate(-4deg)}}
@keyframes pgdThread{0%,100%{height:var(--len,140px)}50%{height:calc(var(--len,140px) + 70px)}}
@keyframes pgdDrop{0%,100%{top:calc(var(--len,140px) - 4px)}50%{top:calc(var(--len,140px) + 66px)}}

/* ---------- corners ---------- */
.pgDecor__corner{bottom:0;width:clamp(64px,7vw,108px);line-height:0;filter:drop-shadow(0 2px 3px rgba(0,0,0,.18))}
.pgDecor__corner img{width:100%;height:auto;display:block}
.pgDecor__corner--start{left:max(6px,env(safe-area-inset-left))}
.pgDecor__corner--end{right:max(6px,env(safe-area-inset-right))}
.pgDecor--toggle .pgDecor__corner--start{left:max(60px,calc(env(safe-area-inset-left) + 54px))}
.pgDecor--corners-gifts .pgDecor__corner,.pgDecor--corners-eggs .pgDecor__corner{width:clamp(90px,9vw,132px)}
.pgDecor__corner--pumpkin{width:clamp(56px,6vw,92px)}
.pgDecor__corner--pumpkin img{animation:pgdFlicker 3.5s ease-in-out infinite}
@keyframes pgdFlicker{0%,100%{filter:brightness(1)}40%{filter:brightness(1.12)}45%{filter:brightness(.94)}60%{filter:brightness(1.08)}}

/* ---------- flyers ---------- */
.pgDecor__flyer{left:0;top:0;will-change:transform}
.pgDecor__flyer img{display:block;width:100%;height:auto}
.pgDecor__flyer--sleigh{width:clamp(170px,20vw,260px)}
.pgDecor__flyer--sleigh img{animation:pgdBob 1.6s ease-in-out infinite}
.pgDecor__flyer--bat{width:clamp(34px,4vw,56px)}
.pgDecor__flyer--bat img{animation:pgdFlap .28s ease-in-out infinite alternate;transform-origin:50% 40%}
@keyframes pgdBob{0%,100%{transform:translateY(0)}50%{transform:translateY(7px)}}
@keyframes pgdFlap{from{transform:scaleY(1)}to{transform:scaleY(.45)}}

/* ---------- snow along the bottom of the header ---------- */
.pgDecor__cap{position:absolute;left:0;right:0;bottom:-12px;height:18px;pointer-events:none;z-index:5;background:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%20160%2022%27%20preserveAspectRatio%3D%27none%27%3E%3Cpath%20d%3D%27M0%200H160V7C152%207%20150%2012%20144%2012C138%2012%20137%208%20130%208C126%208%20125%2015%20121%2015C117%2015%20118%209%20110%209C100%209%2099%2013%2090%2013C82%2013%2081%207%2072%207C66%207%2066%2018%2062%2018C58%2018%2059%209%2052%209C44%209%2042%2013%2034%2013C26%2013%2025%208%2018%208C12%208%2010%2011%205%2011C2%2011%201%208%200%208Z%27%20fill%3D%27white%27/%3E%3C/svg%3E") 0 0/160px 18px repeat-x;filter:drop-shadow(0 1px 1px rgba(40,60,90,.35))}

/* ---------- hats on the avatars beside posts ---------- */
html:not(.pgDecor-off):has(.pgDecor[class*="pgDecor--hats-"]) [data-ips-hook="postUserPhoto"]::before{content:"";position:absolute;z-index:2;pointer-events:none;background:var(--pgd-hat) center/contain no-repeat;aspect-ratio:100/80}
html:not(.pgDecor-off):has(.pgDecor--hats-santa) [data-ips-hook="postUserPhoto"]::before{width:78%;left:-14%;top:-36%;transform:rotate(-16deg)}
html:not(.pgDecor-off):has(.pgDecor--hats-witch) [data-ips-hook="postUserPhoto"]::before{width:86%;left:7%;top:-50%;transform:rotate(-8deg)}
html:not(.pgDecor-off):has(.pgDecor--hats-bunny) [data-ips-hook="postUserPhoto"]::before{width:70%;left:15%;top:-52%}

/* ---------- greeting ---------- */
.pgDecorGreeting{--pgd-g1:var(--i-color_primary,#3d6594);--pgd-g2:var(--i-color_secondary,#2a4a70);display:flex;align-items:center;gap:.7em;margin:12px auto 0;width:fit-content;max-width:calc(100% - 24px);padding:.45em .5em .45em 1em;border-radius:999px;
	background:linear-gradient(100deg,color-mix(in srgb,var(--pgd-g1) 16%,var(--i-background_1,#fff)),color-mix(in srgb,var(--pgd-g2) 16%,var(--i-background_1,#fff)));
	border:1px solid color-mix(in srgb,var(--pgd-g1) 35%,transparent);color:var(--i-color_hard,inherit);font-weight:600;box-shadow:0 2px 10px rgba(0,0,0,.06);animation:pgdIn .5s ease-out both}
.pgDecorGreeting[hidden]{display:none}
.pgDecorGreeting__icon{font-size:1.25em;line-height:1}
.pgDecorGreeting__close{all:unset;cursor:pointer;width:1.7em;height:1.7em;border-radius:50%;display:grid;place-items:center;font-size:1.05em;line-height:1;opacity:.6}
.pgDecorGreeting__close:hover,.pgDecorGreeting__close:focus-visible{opacity:1;background:color-mix(in srgb,currentColor 12%,transparent)}
.pgDecorGreeting__close:focus-visible{outline:2px solid currentColor;outline-offset:1px}
@keyframes pgdIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}

/* ---------- visitor on/off button and preview label ---------- */
.pgDecor__toggle{position:fixed;left:max(12px,env(safe-area-inset-left));bottom:max(12px,env(safe-area-inset-bottom));z-index:4002;width:40px;height:40px;border-radius:50%;border:1px solid var(--i-box--bo-co,rgba(0,0,0,.12));
	background:var(--i-background_1,#fff);color:var(--i-color_hard,#222);box-shadow:0 2px 10px rgba(0,0,0,.16);cursor:pointer;display:grid;place-items:center;font-size:19px;line-height:1;opacity:.82;transition:opacity .2s,transform .2s;padding:0}
.pgDecor__toggle:hover,.pgDecor__toggle:focus-visible{opacity:1;transform:scale(1.07)}
.pgDecor__toggle:focus-visible{outline:2px solid var(--i-color_primary,#3d6594);outline-offset:2px}
html.pgDecor-off .pgDecor__toggle{filter:grayscale(1);opacity:.55}
.pgDecor__badge{position:fixed;top:10px;left:50%;transform:translateX(-50%);z-index:4003;background:#111827;color:#fff;font:600 13px/1.2 system-ui,sans-serif;padding:7px 14px;border-radius:999px;box-shadow:0 4px 14px rgba(0,0,0,.25);pointer-events:none}
@media (max-width:979px){
	.pgDecor__toggle{bottom:calc(max(12px,env(safe-area-inset-bottom)) + 64px);width:36px;height:36px;font-size:17px}
}
@media (prefers-reduced-motion:reduce){
	.pgDecor__bulb,.pgDecor__flag,.pgDecor__spider,.pgDecor__spider::before,.pgDecor__spider img,.pgDecor__corner--pumpkin img,.pgDecorGreeting{animation:none!important}
}
@media print{.pgDecor,.pgDecor__canvas,.pgDecor__layer,.pgDecor__fixed,.pgDecor__toggle,.pgDecorGreeting,.pgDecor__cap{display:none!important}}
