/* Unusual Hours mischief, drawn with FENN's existing cartoon palette. */
:root{--uh-lime:#d5ff00;--uh-purple:#8854ee;--uh-orange:#ff8754;--uh-ink:#071f15;--uh-spring:cubic-bezier(.2,.8,.25,1.2)}
.fenn-effects header,.fenn-effects main,.fenn-effects footer{position:relative;z-index:1}
.fenn-effects header{z-index:3}
.fenn-effects button,.fenn-effects a{ -webkit-tap-highlight-color:transparent }
.fenn-effects :is(button,a):focus-visible{outline:3px solid var(--uh-lime);outline-offset:5px}

/* A few leaves and lights sit behind the content, never over the text. */
.forest-atmosphere{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:0;contain:strict}
.forest-atmosphere:before,.forest-atmosphere:after{content:"";position:absolute;width:34vw;height:58vh;border-radius:50%;opacity:.2;pointer-events:none}
.forest-atmosphere:before{left:-23vw;top:24vh;background:radial-gradient(ellipse,#9c58ff 0,transparent 68%)}
.forest-atmosphere:after{right:-23vw;bottom:5vh;background:radial-gradient(ellipse,#ff8754 0,transparent 68%)}
.forest-mote{position:absolute;left:var(--x);top:var(--y);width:var(--size);height:var(--size);border-radius:50%;background:#e6ffa3;box-shadow:0 0 10px 3px #d5ff0033;opacity:.65;animation:forest-drift var(--duration) ease-in-out infinite alternate;animation-delay:var(--delay)}
.forest-leaf{position:absolute;left:var(--x);top:-45px;width:22px;height:34px;border:2px solid #133b21;border-radius:3px 85% 3px 85%;background:#a6d333;animation:leaf-fall var(--duration) linear infinite;animation-delay:var(--delay);opacity:.65}
.forest-leaf:after{content:"";position:absolute;top:4px;left:9px;width:2px;height:25px;background:#245b26;transform:rotate(-29deg)}
@keyframes forest-drift{from{transform:translate3d(-12px,12px,0);opacity:.15}to{transform:translate3d(24px,-38px,0);opacity:.75}}
@keyframes leaf-fall{0%{transform:translate3d(0,-40px,0) rotate(-25deg);opacity:0}10%{opacity:.65}50%{transform:translate3d(48px,55vh,0) rotate(95deg)}90%{opacity:.6}100%{transform:translate3d(-35px,110vh,0) rotate(185deg);opacity:0}}

/* Wordmark stays the same size. FENN keeps both feet planted. */
.wordmark-stage{position:relative;isolation:isolate}
.wordmark-stage:before{content:"";position:absolute;inset:10% -4% 0;background:radial-gradient(ellipse,#d5ff001c 0,#b9ff000a 48%,transparent 70%);z-index:-1;pointer-events:none}
.wordmark-stage .wordmark{position:relative;z-index:1;filter:drop-shadow(0 7px 0 #071f1555)}
.hero-spark{position:absolute;pointer-events:none;color:var(--uh-lime);width:30px;height:30px;z-index:2;filter:drop-shadow(2px 3px 0 #071f15);animation:spark-turn 7s ease-in-out infinite}
.hero-spark svg{width:100%;height:100%;display:block}
.hero-spark:nth-of-type(1){left:0;top:28%;width:22px;color:var(--uh-orange);animation-delay:-2s}
.hero-spark:nth-of-type(2){right:2%;top:14%;color:var(--uh-lime);animation-delay:-4s}
.hero-spark:nth-of-type(3){right:6%;bottom:10%;width:22px;color:#b894ff;animation-delay:-1s}
@keyframes spark-turn{0%,100%{transform:rotate(-10deg) scale(.85)}50%{transform:rotate(16deg) scale(1.1)}}
.fenn-main .tagline{position:relative;z-index:2;line-height:1.65}
.mostly-mark{display:inline-block;padding:0 9px 1px;margin-left:3px;border:2px solid var(--uh-ink);border-radius:44% 12% 32% 14% / 14% 38% 18% 40%;background:#7440c7;color:#fff;box-shadow:3px 4px 0 var(--uh-orange);text-shadow:1px 2px 0 #352152;transform:rotate(-3deg)}
.fenn-main .purpose-heading{text-shadow:2px 3px 0 var(--uh-ink),0 3px 15px #071f15}
.fenn-main .mascot{animation:none;transform:none;filter:drop-shadow(0 11px 0 #09251533) drop-shadow(0 0 18px #d5ff0026)}

/* Ink outlines, offset color, and springy presses. No changes to the artwork. */
.fenn-effects header nav a{transition:transform .22s var(--uh-spring),background .2s,box-shadow .2s,color .2s}
.fenn-effects header nav a:hover{transform:translateY(-3px) rotate(-2deg);background:var(--uh-lime);color:var(--uh-ink);text-shadow:none;box-shadow:3px 4px 0 var(--uh-ink),5px 6px 0 #8854ee}
.fenn-effects header nav a[aria-current]{text-shadow:none;box-shadow:3px 4px 0 var(--uh-ink),5px 6px 0 #8854ee}
.fenn-effects header nav .social-nav-icon{border:2px solid #071f15;box-shadow:2px 3px 0 #071f15,3px 4px 0 #c2e79b88}
.fenn-effects .home-link,.fenn-effects .brand{transition:transform .25s var(--uh-spring)}
.fenn-effects :is(.home-link,.brand):hover{transform:rotate(-3deg) scale(1.03)}
.fenn-main .token-panel,.fenn-main .buy-steps li{border:3px solid var(--uh-ink);background:linear-gradient(145deg,#163e29fa,#09291ffa);box-shadow:0 0 0 2px #b6e66c88,7px 9px 0 #071f15,11px 13px 0 #8050c780,0 22px 32px #031a1555}
.fenn-main .token-panel{border-radius:28px 18px 30px 18px}
.fenn-main .token-panel:before{height:5px;left:32px;width:80px;box-shadow:92px 0 0 var(--uh-purple),184px 0 0 var(--uh-orange)}
.fenn-main .token-panel:after{opacity:.13}
.fenn-main .token-symbol{border:3px solid var(--uh-ink);background:var(--uh-lime);color:#123b25;box-shadow:4px 5px 0 var(--uh-purple);border-radius:14px 8px 16px 8px;transform:rotate(5deg)}
.fenn-main .token-grid dt{color:#a8d197}
.fenn-main .contract{box-shadow:inset 0 2px 0 #d5ff0022,0 4px 0 #061e16;background:#071f16;border-color:#427343}
.fenn-main .contract-row input{background:#0b291d;border-color:#6a9458;color:#efffd9}
.fenn-main .buy-launchpad{border-radius:12px;box-shadow:4px 5px 0 #061e16,6px 7px 0 #8854ee99}
.fenn-main .buy-steps li{border-radius:22px 13px 25px 13px;transition:transform .25s var(--uh-spring),box-shadow .25s}
.fenn-main .step-number{align-self:flex-start;display:grid;place-items:center;width:65px;height:61px;margin-bottom:24px;font-size:32px;letter-spacing:-.04em;background:var(--uh-lime);color:#112f1c;border:3px solid #071f15;border-radius:18px 9px 20px 11px;box-shadow:3px 4px 0 #071f15;transform:rotate(-6deg)}
.fenn-main .buy-steps li:nth-child(2) .step-number{background:#ad86f5;transform:rotate(5deg)}
.fenn-main .buy-steps li:nth-child(3) .step-number{background:#ff986e;transform:rotate(-4deg)}
.fenn-main .buy-steps p{color:#d0e2c5}
.fenn-main .buy-heading h2{text-shadow:2px 3px 0 #071f15,4px 5px 0 #5b3b8577}
.fenn-main .buy-heading h2 span{display:inline-block;text-shadow:2px 3px 0 #071f15,4px 5px 0 #7547aeaa}
.fenn-main .buy-heading .section-kicker,.fenn-main .plan-kicker{text-shadow:2px 3px 0 #071f15}
.fenn-main .plan-number{background:var(--uh-lime);border-color:var(--uh-ink);box-shadow:3px 4px 0 #071f15,5px 6px 0 #8854ee;font-size:20px;transform:rotate(-7deg)}
.fenn-main .plan-stop:nth-child(2) .plan-number{background:#b48cf7;transform:rotate(7deg)}
.fenn-main .plan-stop:nth-child(3) .plan-number{background:#ff986e}
.fenn-main .plan-stop img{box-shadow:0 0 0 2px #b6e66c99,6px 8px 0 #071f15,9px 11px 0 #8050c788;transition:transform .3s var(--uh-spring)}
.fenn-main .plan-copy h3{text-shadow:2px 3px 0 #071f15}
.fenn-main .meme-viewer{box-shadow:0 0 0 2px #b6e66c88,inset 0 4px 0 #e1ac68,inset 0 -9px 0 #63391f,0 14px 0 #061e16,6px 19px 0 #7547ae99,0 28px 35px #031a1555}
.fenn-main .tv-brand{color:#e1ff72;transform:rotate(-4deg);text-shadow:2px 3px #422715}
.fenn-main .tv-screen{position:relative;overflow:hidden}
.fenn-main .tv-console .viewer-controls button{transition:transform .25s var(--uh-spring),background .2s}
.fenn-main .meme-actions :is(a,button){border:2px solid #071f15;border-radius:9px;box-shadow:2px 3px 0 #071f15;transition:transform .2s var(--uh-spring),background .2s}
.fenn-main .meme-share{background:#7340bb;color:#fff}
.fenn-main .meme-share:hover{background:#8f5ad8}
.fenn-main .music-toggle{border:3px solid #d5ff00;box-shadow:3px 4px 0 #071f15,5px 6px 0 #7547ae99}
.fenn-main .music-toggle[data-state="playing"]:after{content:"";position:absolute;inset:-7px;border:2px solid #d5ff00;border-radius:50%;pointer-events:none;animation:music-ring 2.5s ease-out infinite}
@keyframes music-ring{0%{transform:scale(.93);opacity:.5}100%{transform:scale(1.27);opacity:0}}
.fenn-effects :is(.creator-space,.creator-credit) img{transition:transform .45s var(--uh-spring);filter:drop-shadow(2px 3px 0 #071f1533)}
.fenn-effects :is(.creator-space,.creator-credit):hover img{transform:rotate(-9deg) scale(1.1)}
.fenn-effects .unusual-clock time{text-shadow:2px 2px 0 #492d60}

/* Carry the same ink and color treatment into the Treasury. */
.fenn-treasury .hero{box-shadow:0 0 0 2px #b6e66c88,5px 8px 0 #071f15,8px 11px 0 #8854ee88}
.fenn-treasury .stat,.fenn-treasury .panel{box-shadow:0 0 0 1px #b6e66c88,5px 7px 0 #071f15,8px 10px 0 #8050c766,0 16px 24px #031a1544}
.fenn-treasury .stat{border-radius:20px 12px 22px 12px;transition:transform .25s var(--uh-spring)}
.fenn-treasury .stat:nth-child(2){border-top-color:#ad86f5}.fenn-treasury .stat:nth-child(3){border-top-color:#ff986e}
.fenn-treasury h1{text-shadow:2px 3px 0 #071f15,4px 5px 0 #633c8a88}
.fenn-treasury .primary{box-shadow:3px 4px 0 #071f15,5px 6px 0 #8854ee;transition:transform .22s var(--uh-spring)}
.fenn-treasury .periods button{transition:transform .2s var(--uh-spring),background .2s}
.fenn-treasury .periods button[aria-pressed=true]{box-shadow:2px 3px 0 #071f15;transform:rotate(-3deg)}

/* Tiny interaction bursts: bounded and short-lived, without a cursor trail. */
.mischief-burst{position:fixed;z-index:110;pointer-events:none;width:0;height:0}
.mischief-burst i{position:absolute;width:9px;height:9px;background:var(--burst-color);clip-path:polygon(50% 0,63% 35%,100% 50%,65% 63%,50% 100%,36% 65%,0 50%,35% 36%);animation:burst-out .55s ease-out both}
@keyframes burst-out{0%{transform:translate(0,0) scale(.4);opacity:1}100%{transform:translate(var(--dx),var(--dy)) rotate(100deg) scale(.3);opacity:0}}
.effects-toggle{position:fixed;z-index:100;right:20px;bottom:max(24px,env(safe-area-inset-bottom));display:flex;align-items:center;justify-content:center;gap:7px;min-height:40px;padding:8px 12px;border:2px solid #95ba66;border-radius:30px;background:#0c2c20ed;color:#e6f8c8;font:600 11px 'Fraunces',Georgia,serif;box-shadow:2px 3px 0 #071f15;cursor:pointer;transition:transform .2s,background .2s}
.fenn-main .effects-toggle{right:84px}.effects-toggle svg{width:13px;height:13px;fill:currentColor;flex:none}.effects-toggle:hover{background:#24432d;transform:translateY(-2px)}.effects-toggle:disabled{cursor:default}
.motion-paused .forest-atmosphere *,.motion-paused .hero-spark,.motion-paused .music-toggle:after,.effects-sleeping .forest-atmosphere *,.effects-sleeping .hero-spark,.effects-sleeping .music-toggle:after{animation-play-state:paused!important}
.motion-paused .forest-atmosphere{opacity:.3}
.motion-paused :is(a,button,img,li),.motion-paused .stat{transition:none!important}
.motion-paused .mischief-burst{display:none}
html.effects-paused,html.effects-paused .meme-grid{scroll-behavior:auto}
@media(hover:hover) and (prefers-reduced-motion:no-preference){
 .fenn-main .buy-steps li:hover,.fenn-treasury .stat:hover{transform:translateY(-6px) rotate(-.6deg)}
 .fenn-main .plan-stop:hover img{transform:translateY(-5px) rotate(-1.3deg)}
 .fenn-main .meme-actions :is(a,button):hover,.fenn-treasury .primary:hover{transform:translateY(-3px)}
 .fenn-main .tv-console .viewer-controls button:hover{transform:rotate(-15deg) scale(1.07)}
 .fenn-effects :is(button,a):active{transform:translateY(2px) scale(.97)}
 .motion-paused :is(.plan-stop:hover img,.buy-steps li:hover,.stat:hover){transform:none}
}
@media(max-width:760px){.hero-spark{width:23px;height:23px}.fenn-main .token-panel{border-radius:22px 14px}.fenn-main .buy-steps li{box-shadow:0 0 0 1px #b6e66c88,4px 6px 0 #071f15,7px 9px 0 #8050c780}.fenn-main .step-number{width:55px;height:53px;font-size:29px}.forest-leaf:nth-child(n+13){display:none}.forest-mote:nth-child(n+7){display:none}}
@media(max-width:600px){.effects-toggle{bottom:max(23px,env(safe-area-inset-bottom));right:14px;padding:8px 10px;min-height:38px;font-size:10px}.fenn-main .effects-toggle{right:71px}.fenn-main .mostly-mark{padding:0 7px}.hero-spark:nth-of-type(1){left:1%;top:19%}.fenn-treasury footer{padding-bottom:85px}.fenn-main .closing-section{padding-bottom:95px}}
@media(prefers-reduced-motion:reduce){
 .forest-atmosphere,.mischief-burst{display:none}
 .fenn-effects *,.fenn-effects *:before,.fenn-effects *:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
 .fenn-effects header nav a:hover,.fenn-effects :is(.home-link,.brand):hover,.fenn-effects :is(.creator-space,.creator-credit):hover img{transform:none}
}

/* A drawn current and expanding rings, registered to the existing stream. */
.stream-window{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none;contain:strict;opacity:.68}
.stream-water{position:absolute;max-width:none;overflow:hidden}
.stream-current{fill:none;stroke:#d8fff7;stroke-width:3;stroke-linecap:round;stroke-dasharray:12 88;animation:stream-flow var(--water-duration) linear infinite;animation-delay:var(--water-delay)}
.stream-current:nth-child(1){stroke-width:2;opacity:.8}
.stream-ripple{fill:none;stroke:#d6fff9;stroke-width:2.6;opacity:0;transform-origin:0 0;animation:stream-ring 7s ease-out infinite;animation-delay:var(--water-delay)}
@keyframes stream-flow{from{stroke-dashoffset:100}to{stroke-dashoffset:0}}
@keyframes stream-ring{0%{transform:scale(.88,.82);opacity:0}20%{opacity:.8}100%{transform:scale(1.25,1.6);opacity:0}}
.fenn-treasury .stream-window{inset:-8px;opacity:.3;filter:blur(2px)}

/* Registered master-image layers retain the original colors and proportions. */
.feather-stage{position:relative}
.feather-stage .feather-fallback{display:block;width:100%;height:100%;object-fit:contain;filter:none}
.feather-art{position:absolute;inset:0;width:100%;height:100%;opacity:0;pointer-events:none;overflow:visible}
.feather-ready .feather-fallback{opacity:0}
.feather-ready .feather-art{opacity:1}
.feather-vane{transform-origin:407px 163px;animation:feather-breeze 4.8s ease-in-out infinite}
@keyframes feather-breeze{0%,100%{transform:rotate(0deg)}22%{transform:rotate(-4deg)}38%{transform:rotate(1.8deg)}53%{transform:rotate(-2.6deg)}72%{transform:rotate(.8deg)}88%{transform:rotate(0deg)}}
.fenn-breathing{transform-origin:512px 1100px;animation:fenn-breathe 5.6s ease-in-out infinite}
.fenn-head-pose{transform-origin:552px 549px;animation:fenn-head-idle 13s ease-in-out infinite}
@keyframes fenn-breathe{0%,100%{transform:scaleY(1)}42%{transform:scaleY(1.006)}66%{transform:scaleY(1.003)}}
@keyframes fenn-head-idle{0%,16%,62%,100%{transform:rotate(0deg)}30%{transform:rotate(-.5deg)}41%{transform:rotate(-.35deg)}79%{transform:rotate(.35deg)}89%{transform:rotate(.2deg)}}
.feather-resting :is(.feather-vane,.fenn-breathing,.fenn-head-pose){animation-play-state:paused}
.fenn-treasury .treasury-archer{height:190px;width:127px;max-width:150px;flex-shrink:0}
.fenn-treasury .closing .feather-fallback{height:100%;width:100%;max-width:none}
@media(max-width:640px){.fenn-treasury .treasury-archer{height:160px;width:100px}}

/* A brief analogue tuning roll, contained inside the TV picture. */
.tv-tuning-window{position:absolute;top:14px;left:14px;right:14px;aspect-ratio:1;border-radius:21px;z-index:3;overflow:hidden;pointer-events:none;opacity:0;background:repeating-linear-gradient(0deg,transparent 0 4px,#07261c24 4px 6px)}
.tv-tuning-sweep{position:absolute;inset:0 0 auto;height:24%;background:linear-gradient(transparent,#153e3138 20%,#dcffe366 46%,#bad68555 51%,#153e3155 58%,transparent);border-bottom:1px solid #e9ffb744;transform:translateY(-110%)}
.tv-channel-number{position:absolute;top:16px;left:18px;color:#d5ff00;background:#092a20d9;padding:5px 9px;border-radius:4px;font:800 15px 'Fraunces',Georgia,serif;letter-spacing:.08em;text-shadow:1px 2px 0 #061e16;box-shadow:2px 2px 0 #061e1666}
@media(max-width:600px){.tv-tuning-window{top:9px;left:9px;right:9px;border-radius:15px}.tv-channel-number{top:10px;left:11px;font-size:12px}}
.motion-paused :is(.stream-current,.stream-ripple,.feather-vane,.fenn-breathing,.fenn-head-pose),.effects-sleeping :is(.stream-current,.stream-ripple,.feather-vane,.fenn-breathing,.fenn-head-pose){animation-play-state:paused!important}
.motion-paused .stream-window,.motion-paused .tv-tuning-window{display:none}
.motion-paused .feather-ready .feather-art{opacity:0}
.motion-paused .feather-ready .feather-fallback{opacity:1}
@media(prefers-reduced-motion:reduce){.stream-window,.tv-tuning-window,.feather-art{display:none}.feather-ready .feather-fallback{opacity:1}}