:root{--punk-black: #050505;--punk-void: #17181d;--punk-brown: #b48864;--punk-tan: #e3bf8b;--punk-cream: #fff4d7;--punk-display: "Frijole", Impact, sans-serif;--poop-brown: #6f432b;--page-gutter: 8vw;--roll-width: min(calc(100vw - (var(--page-gutter) * 2)), 560px);--sheet-width: var(--roll-width);--header-height: 88px;--intro-left: var(--page-gutter)}*{box-sizing:border-box}html,body{min-height:100%;margin:0;overflow-x:hidden;scrollbar-color:var(--poop-brown) rgba(31,19,13,.78);scrollbar-width:thin}body{background:var(--punk-void);color:var(--punk-cream);font-family:Dokdo,Inter,ui-sans-serif,system-ui,sans-serif}body::-webkit-scrollbar{width:14px}body::-webkit-scrollbar-track{background:#1f130dc7;border-left:2px solid var(--punk-black)}body::-webkit-scrollbar-thumb{background:var(--poop-brown);border:2px solid var(--punk-black)}.landing-content{background:radial-gradient(circle at 22% 72%,rgba(180,136,100,.22),transparent 19%),linear-gradient(#17181da8,#17181deb),linear-gradient(rgba(227,191,139,.05) 2px,transparent 2px),linear-gradient(90deg,rgba(227,191,139,.05) 2px,transparent 2px),var(--punk-void);background-attachment:fixed,fixed,fixed,fixed,fixed;background-size:auto,auto,96px 96px,96px 96px,auto;color:var(--punk-cream);isolation:isolate;overflow:hidden;min-height:100vh;padding:var(--header-height) var(--page-gutter) 8vw;position:relative}.landing-content:before{background:radial-gradient(circle at 76% 18%,rgba(38,130,139,.24),transparent 21%);content:"";top:0;right:0;bottom:0;left:0;pointer-events:none;position:fixed;z-index:0}.ambient-dust-layer{top:0;right:0;bottom:0;left:0;overflow:hidden;pointer-events:none;position:fixed;z-index:35}.bug-layer{inset:var(--header-height) 0 0;overflow:hidden;pointer-events:none;position:fixed;z-index:0}.bug{--bug-angle: 0rad;--scale: .7;background:#000000eb;border-radius:50%;box-shadow:1px 1px #000000a8,-1px 0 #00000070;height:7.5px;opacity:.86;position:absolute;transform:translateZ(0) rotate(var(--bug-angle)) scale(var(--scale));transform-origin:50% 50%;width:7.5px}.footprint-dot{--footprint-angle: 0rad;--footprint-scale: 1;animation:footprint-fade 6.2s ease-out forwards;background:#fff9e8b8;border-radius:50%;height:1.6px;opacity:.48;pointer-events:none;position:absolute;transform:translateZ(0) rotate(var(--footprint-angle)) scale(var(--footprint-scale));transform-origin:50% 50%;width:1.6px}.dust-particle{--dust-angle: 0rad;--dust-glow: .8;--dust-pulse: 4s;--dust-scale: 1;animation:dust-glow var(--dust-pulse) ease-in-out infinite alternate;background:rgba(180,136,100,calc(.42 + (var(--dust-glow) * .18)));border-radius:50%;box-shadow:0 0 calc(4px + (var(--dust-glow) * 5px)) #e3bf8b38;height:calc(2.5px * var(--dust-scale));opacity:.54;pointer-events:none;position:absolute;transform:translateZ(0) rotate(var(--dust-angle));transform-origin:50% 50%;width:calc(2.5px * var(--dust-scale))}@keyframes dust-glow{0%{filter:brightness(.72) blur(.05px);opacity:.34}48%{filter:brightness(1.18) blur(0);opacity:calc(.44 + (var(--dust-glow) * .16))}to{filter:brightness(1.42) blur(.12px);opacity:calc(.5 + (var(--dust-glow) * .22))}}@keyframes footprint-fade{0%{opacity:.58}72%{opacity:.36}to{opacity:0;transform:translateZ(0) rotate(var(--footprint-angle)) scale(calc(var(--footprint-scale) * .6))}}.site-header{background:linear-gradient(180deg,#050505f5,#111216f0),var(--punk-void);border-bottom:4px solid rgba(5,5,5,.9);box-shadow:0 10px 28px #05050561;height:var(--header-height);left:0;position:fixed;right:0;top:0;z-index:20}.landing-brand{align-items:flex-start;display:flex;gap:10px;left:24px;max-width:calc(100vw - 294px);position:fixed;top:14px;z-index:21}.landing-brand img{background:var(--punk-tan);border:3px solid var(--punk-black);box-shadow:4px 4px 0 var(--punk-black);height:44px;image-rendering:pixelated;object-fit:cover;object-position:top center;width:44px}.brand-copy{display:grid;gap:8px;justify-items:start;min-width:0;padding-top:4px}.brand-copy span{color:var(--punk-cream);font-family:var(--punk-display);font-size:clamp(22px,3vw,34px);font-weight:400;line-height:1;overflow-wrap:anywhere;text-shadow:2px 2px 0 var(--punk-black),4px 4px 0 rgba(180,136,100,.55);text-transform:uppercase}.brand-subtitle{color:var(--punk-brown);font-family:var(--punk-display);font-size:14px;line-height:1;overflow-wrap:anywhere;text-transform:uppercase}.landing-actions{align-items:center;display:flex;gap:10px;position:fixed;right:24px;top:17px;z-index:21}.social-link,.music-toggle,.menu-toggle{align-items:center;background:var(--punk-void);border:3px solid var(--punk-black);box-shadow:4px 4px 0 var(--punk-black);color:var(--punk-cream);cursor:pointer;display:grid;height:54px;justify-items:center;padding:0;position:relative;transition:background .16s ease,box-shadow .16s ease,filter .16s ease,transform .16s ease;width:64px}.social-link{color:var(--punk-cream);font-family:var(--punk-display);font-size:25px;line-height:1;text-decoration:none}.social-link span{filter:drop-shadow(3px 3px 0 rgba(5,5,5,.96)) drop-shadow(-1px -1px 0 rgba(255,255,255,.28));opacity:.68;transform:translateY(-1px);transition:color .16s ease,filter .16s ease,opacity .16s ease,transform .16s ease}.music-toggle:before{background:#00000057;content:"";top:6px;right:6px;bottom:6px;left:6px;position:absolute}.menu-toggle{--menu-icon-height: 28px;--menu-line-height: 3px}.menu-toggle:before{background:#00000057;content:"";top:6px;right:6px;bottom:6px;left:6px;position:absolute}.menu-toggle span{background:var(--punk-cream);box-shadow:4px 4px #050505f5,-1px -1px #ffffff47;display:block;height:var(--menu-line-height);opacity:.54;left:50%;position:absolute;top:50%;transition:background .16s ease,box-shadow .16s ease,opacity .16s ease,transform .16s ease;transform:translate(-50%,-50%);width:28px;z-index:1}.menu-toggle span:nth-child(1){transform:translate(-50%,calc(-50% - ((var(--menu-icon-height) - var(--menu-line-height)) / 2)))}.menu-toggle span:nth-child(3){transform:translate(-50%,calc(-50% + ((var(--menu-icon-height) - var(--menu-line-height)) / 2)))}.music-toggle .play-icon{background:var(--punk-cream);clip-path:polygon(14% 5%,88% 50%,14% 95%,30% 50%);display:block;filter:drop-shadow(4px 4px 0 rgba(5,5,5,.96)) drop-shadow(-1px -1px 0 rgba(255,255,255,.36));height:28px;opacity:.48;position:relative;transform:skewY(-8deg);transition:background .16s ease,filter .16s ease,opacity .16s ease,transform .16s ease;width:32px;z-index:1}.music-toggle .play-icon:after{background:var(--poop-brown);clip-path:polygon(14% 5%,88% 50%,14% 95%,30% 50%);content:"";top:0;right:0;bottom:0;left:0;opacity:.52;position:absolute;transform:translate(5px,5px);z-index:-1}.social-link:hover,.social-link:focus-visible,.music-toggle:hover,.music-toggle:focus-visible,.menu-toggle:hover,.menu-toggle:focus-visible{background:#22262d;box-shadow:3px 3px 0 var(--punk-black);color:var(--punk-cream);outline:0;transform:translate(1px,1px)}.social-link:hover span,.social-link:focus-visible span{color:var(--punk-tan);filter:drop-shadow(3px 3px 0 rgba(5,5,5,.96)) drop-shadow(0 0 9px rgba(227,191,139,.78));opacity:1;transform:translateY(-1px) scale(1.05)}.music-toggle:hover .play-icon,.music-toggle:focus-visible .play-icon{opacity:.72}.menu-toggle:hover span,.menu-toggle:focus-visible span{background:var(--punk-tan);box-shadow:3px 3px #050505f5,0 0 9px #e3bf8bb8;opacity:.9}.menu-toggle[aria-expanded=true]{background:radial-gradient(circle at 50% 50%,rgba(227,191,139,.3),transparent 58%),var(--punk-void)}.menu-toggle[aria-expanded=true] span{background:var(--punk-tan);opacity:1}.menu-toggle[aria-expanded=true] span:nth-child(1){transform:translate(-50%,-50%) rotate(45deg)}.menu-toggle[aria-expanded=true] span:nth-child(2){opacity:0;transform:scaleX(.2)}.menu-toggle[aria-expanded=true] span:nth-child(3){transform:translate(-50%,-50%) rotate(-45deg)}.portrait-menu-backdrop{background:#05050580;border:0;cursor:pointer;inset:var(--header-height) 0 0;padding:0;position:fixed;z-index:22}.portrait-menu{align-items:center;background:linear-gradient(180deg,#111216fa,#111216ed),var(--punk-void);border:4px solid var(--punk-black);box-shadow:10px 10px 0 var(--punk-black),0 18px 42px #05050575;display:grid;height:min(74vh,620px);justify-items:center;padding:28px;position:fixed;right:24px;top:calc(var(--header-height) + 18px);width:min(320px,calc(100vw - 48px));z-index:23}.portrait-menu p{color:var(--punk-cream);font-family:var(--punk-display);font-size:clamp(18px,5vw,28px);line-height:1.35;margin:0;text-align:center;text-shadow:2px 2px 0 var(--punk-black),4px 4px 0 rgba(38,130,139,.38);text-transform:uppercase}.music-toggle.is-on{background:radial-gradient(circle at 50% 50%,rgba(227,191,139,.34),transparent 58%),var(--punk-void);box-shadow:4px 4px 0 var(--punk-black),0 0 18px #e3bf8b7a}.music-toggle.is-on .play-icon{background:var(--punk-tan);filter:drop-shadow(4px 4px 0 rgba(5,5,5,.96)) drop-shadow(0 0 10px rgba(227,191,139,.84));opacity:1;transform:skewY(-8deg) scale(1.06)}.music-toggle:disabled{cursor:wait;opacity:.72;transform:none}.landing-hero{position:relative;z-index:1;align-items:flex-start;display:grid;gap:36px;grid-template-columns:minmax(320px,1fr) minmax(280px,.68fr);justify-content:center;min-height:min(680px,calc(100vh - 82px - 8vw))}.landing-copy{position:relative;z-index:1}.roll-intro{background:linear-gradient(180deg,#111216f7,#111216e6),var(--punk-void);left:var(--intro-left);margin:0;padding:18px 0 84px 30px;box-shadow:inset 12px 0 20px #70614914,inset -16px 0 20px #70614924,18px 0 #050505db;position:fixed;top:var(--header-height);width:var(--sheet-width);z-index:18}.roll-intro>p{color:var(--punk-tan);font-size:20px;line-height:1.45;margin:0 0 4px;max-width:none}.toilet-paper-section{margin:0;max-width:var(--sheet-width);padding-top:124px;position:relative;width:var(--sheet-width);z-index:2}.toilet-roll{display:block;max-height:none;overflow:visible;padding:72px 0 0;perspective:900px;position:relative;width:var(--sheet-width)}.toilet-paper-heading{margin:0;padding:0;position:relative;width:100%;z-index:2}.roll-intro:after{background:linear-gradient(90deg,rgba(21,21,21,.72) 45%,transparent 0) bottom left / 14px 2px repeat-x,linear-gradient(180deg,#fff9e8b8,#fff9e894),url(../../../hedera-pupi-tp.jpg) center / 520px auto repeat,#fff9e8;background-blend-mode:normal,screen,multiply,normal;border:1px solid rgba(17,15,12,.38);border-bottom:0;box-shadow:inset 12px 0 20px #70614914,inset -16px 0 20px #70614924,18px 0 #050505db;content:"";height:64px;left:0;pointer-events:none;position:absolute;right:0;top:calc(100% - 58px);z-index:1}.toilet-paper-heading h1{color:var(--punk-cream);font-family:var(--punk-display);font-size:clamp(40px,7vw,74px);font-weight:400;letter-spacing:0;line-height:.95;margin:0 0 8px;text-shadow:3px 3px 0 var(--punk-black),6px 6px 0 rgba(38,130,139,.44);text-transform:uppercase}.toilet-paper-squares{align-items:flex-start;box-shadow:10px 10px #050505c2;display:flex;flex-direction:column;position:relative;width:100%;z-index:2}.toilet-paper-square{background:linear-gradient(90deg,rgba(245,239,220,.12),transparent 9%,transparent 88%,rgba(159,145,118,.17)),linear-gradient(180deg,#fff9e8ad,#fff9e885),repeating-linear-gradient(3deg,rgba(255,255,255,.18) 0 1px,transparent 1px 5px),url(../../../hedera-pupi-tp.jpg) center / 520px auto repeat,#fff9e8;background-blend-mode:normal,screen,soft-light,multiply,normal;border:1px solid rgba(17,15,12,.46);border-radius:5px 3px 6px 4px;box-shadow:inset 12px 0 18px #70614914,inset -16px 0 22px #70614924,inset 0 1px #ffffffd6,0 14px 26px #05050538;color:#121212;display:flex;flex-direction:column;min-height:360px;padding:22px;position:relative;animation:paper-fold 5.8s ease-in-out infinite;transform-origin:50% 0;transform-style:preserve-3d;will-change:filter,transform;transition:box-shadow .22s ease,filter .22s ease;width:100%}.toilet-paper-square:nth-child(2n){animation-delay:-3.6s;animation-duration:6.7s}.toilet-paper-square:nth-child(3n){animation-delay:-6.2s;animation-duration:7.4s}.toilet-paper-square:first-child{padding-top:52px}@keyframes paper-fold{0%,to{filter:brightness(1);transform:rotateX(0) rotate(0) translateY(0) scaleY(1)}18%{filter:brightness(1.035);transform:rotateX(5.5deg) rotate(-.22deg) translateY(-3px) scaleY(.992)}42%{filter:brightness(.965);transform:rotateX(-6.5deg) rotate(.28deg) translateY(3px) scaleY(1.01)}68%{filter:brightness(1.025);transform:rotateX(4deg) rotate(.18deg) translateY(-1px) scaleY(.996)}}@media(prefers-reduced-motion:reduce){.dust-particle,.footprint-dot{display:none}.toilet-paper-square,.toilet-paper-square:nth-child(2n),.toilet-paper-square:nth-child(3n){animation:none;transform:none;transition:none}}.toilet-paper-square:after{background:linear-gradient(90deg,rgba(21,21,21,.72) 45%,transparent 0),linear-gradient(180deg,rgba(89,75,51,.22),transparent);background-size:14px 2px,auto;bottom:-1px;content:"";height:5px;left:0;position:absolute;right:0;z-index:2}.toilet-paper-square .toilet-paper-meta{color:var(--poop-brown);font-family:var(--punk-display);font-size:14px;margin:0 0 12px;position:relative;z-index:1}.toilet-paper-square h2{color:var(--poop-brown);font-family:var(--punk-display);font-size:24px;letter-spacing:0;margin:0 0 20px;position:relative;text-transform:uppercase;z-index:1}.toilet-paper-square .toilet-paper-body{color:var(--poop-brown);flex:1;font-family:var(--punk-display);font-size:18px;line-height:1.45;margin:0 0 0 20px;overflow-wrap:anywhere;position:relative;text-align:left;white-space:pre-line;z-index:1}@media(max-width:980px){:root{--page-gutter: 28px;--intro-left: var(--page-gutter);--roll-width: min(calc(100vw - (var(--page-gutter) * 2)), 560px);--sheet-width: var(--roll-width)}html,body{overflow-x:hidden}.landing-content{min-height:100%;padding:var(--header-height) var(--page-gutter) 28px}.roll-intro{left:var(--intro-left);width:var(--sheet-width)}.landing-hero{grid-template-columns:1fr}.landing-actions{right:16px;top:16px}}@media(max-width:680px){.landing-brand{left:16px;max-width:calc(100vw - 214px);top:16px}.brand-copy{display:grid;gap:8px;padding-top:1px}.brand-copy span{font-size:clamp(15px,5vw,22px);line-height:.95;text-shadow:2px 2px 0 var(--punk-black),3px 3px 0 rgba(180,136,100,.55)}.brand-subtitle{font-size:clamp(9px,2.5vw,11px);line-height:1.05}.landing-brand img{height:42px;width:42px}.social-link,.music-toggle,.menu-toggle{height:48px;width:54px}.social-link{font-size:21px}.music-toggle .play-icon{height:24px;width:28px}.menu-toggle span{width:24px}.portrait-menu{left:18px;right:18px;top:calc(var(--header-height) + 14px);width:auto}}