@font-face{font-family:KC Slime Time;src:url(/the-band/fonts/KCSlimeTime.otf)format("opentype");font-display:swap}@font-face{font-family:KC Slime Time Solid;src:url(/the-band/fonts/KCSlimeTime-Solid.otf)format("opentype");font-display:swap}:root{--blackwater:#07110e;--acid-eye:#dfff67;--bone:#e0d5a1;--error:#ffb07e;--pixel:4px;color:var(--bone);background:var(--blackwater);letter-spacing:0;font-family:American Typewriter,Iowan Old Style,Cochin,Georgia,serif;font-size:16px;line-height:1.5}*{box-sizing:border-box}html{background:var(--blackwater);min-height:100%}body{background:radial-gradient(circle at 50% 105%, #a0b74438 0 12%, transparent 37%), radial-gradient(circle at 18% 23%, #3f775633 0 9%, transparent 28%), radial-gradient(circle at 82% 28%, #78612624 0 8%, transparent 30%), linear-gradient(180deg, #030504 0%, var(--blackwater) 44%, #0b1712 100%);min-width:320px;min-height:100svh;margin:0;overflow-x:hidden}body:before,body:after{pointer-events:none;content:"";position:fixed;inset:0}body:before{opacity:.2;mix-blend-mode:screen;background:radial-gradient(at 50% 72%,#7f903a24,#0000 58%),radial-gradient(at 24% 18%,#d1a44714,#0000 42%)}body:after{opacity:.42;background:linear-gradient(90deg,#0000007a,#0000 18% 82%,#00000080)}button{font:inherit}.app-shell{z-index:1;grid-template-rows:auto 1fr auto auto;justify-items:center;width:min(100%,980px);min-height:100svh;margin:0 auto;padding:34px 18px 30px;display:grid;position:relative}.app-title{color:var(--acid-eye);font-variant:small-caps;letter-spacing:-.3rem;text-align:center;margin:0;font-family:KC Slime Time,Copperplate,American Typewriter,Iowan Old Style,Georgia,serif;font-size:clamp(4.25rem,14vw,8rem);font-weight:500;line-height:.92;animation:.82s cubic-bezier(.19,1,.22,1) forwards title-rise;position:relative;transform:translateY(8px)}.band-stage{isolation:isolate;grid-template-columns:repeat(4,minmax(62px,1fr));align-items:end;gap:14px;width:min(100%,780px);min-height:330px;margin:14px 0 28px;padding:54px 22px 44px;display:grid;position:relative}.band-stage:before{z-index:-2;border:var(--pixel) solid #23190fe0;content:"";background:radial-gradient(#d3a5482e,#0000 66%),linear-gradient(#46311f00,#46311fbd 42%,#060806eb);height:70px;position:absolute;bottom:20px;left:3%;right:3%;box-shadow:0 10px #070907,0 0 54px #7f903a2e}.band-stage:after{z-index:-3;content:"";background:radial-gradient(at 50% 76%,#173a31b3,#0000 55%),linear-gradient(#0000,#0204036b);border-radius:10px;position:absolute;inset:0;box-shadow:0 0 70px #0000007a}.stage-copy{text-align:center;grid-column:1/-1;align-self:start;max-width:38rem;margin:0 auto}.stage-text,.stage-tagline{text-shadow:0 2px #020403;margin:0;line-height:1.35}.stage-text{color:#e0d5a1d1;font-family:American Typewriter,Iowan Old Style,Cochin,Georgia,serif;font-size:1rem;font-weight:700}.stage-tagline{letter-spacing:-.3rem;color:var(--bone);font-variant:small-caps;text-shadow:0 0 15px #ffd70012;font-family:KC Slime Time,American Typewriter,ui-monospace,Menlo,Monaco,Consolas,monospace;font-size:4rem;font-weight:500;position:relative;top:1.5rem}.band-member{opacity:0;min-width:0;min-height:194px;animation:.76s cubic-bezier(.19,1,.22,1) forwards member-arrive,2.8s ease-in-out infinite member-idle;animation-delay:var(--entry-delay), calc(var(--entry-delay) + .9s);flex-direction:column;justify-content:flex-end;align-items:center;display:flex;position:relative;transform:translateY(22px)scale(.92)}.band-member:before{z-index:0;content:"";background:radial-gradient(#0000008a,#0000 70%);width:70%;min-width:54px;max-width:104px;height:16px;position:absolute;bottom:13px}.band-member:after{z-index:0;clip-path:polygon(42% 0,58% 0,100% 100%,0 100%);content:"";background:linear-gradient(#dfff6712,#0000);height:46px;position:absolute;bottom:37px;left:18%;right:18%}.member-name{z-index:2;min-width:46px;min-height:24px;color:var(--bone);letter-spacing:0;text-align:center;text-overflow:ellipsis;white-space:nowrap;text-shadow:0 2px #020403;background:linear-gradient(#0f1d17f5,#050907f5),radial-gradient(#dfff6729,#0000 62%);border:2px solid #5a421e;place-items:center;margin:0 0 8px;padding:3px 8px 4px;font-family:American Typewriter,ui-monospace,Menlo,Monaco,Consolas,monospace;font-size:13px;font-weight:700;line-height:1;display:inline-grid;position:relative;overflow:hidden;box-shadow:0 0 0 2px #080a06,0 5px #00000057,0 0 18px #dfff6714}.creature-sprite{z-index:1;width:min(30vw,132px);height:auto;image-rendering:pixelated;filter:drop-shadow(0 7px #00000047)drop-shadow(0 0 11px #dfff671a);position:relative}.sprite-eye{animation:1.8s ease-in-out infinite alternate eye-glow}.play-button{min-width:136px;min-height:58px;color:var(--acid-eye);letter-spacing:-.2rem;cursor:pointer;text-shadow:0 2px #020403;background:linear-gradient(#0f1d17f5,#050907f5),radial-gradient(#dfff6729,#0000 62%);border:2px solid #5a421e;border-radius:0;padding:13px 28px 15px;font-family:KC Slime Time,American Typewriter,ui-monospace,Menlo,Monaco,Consolas,monospace;font-size:4rem;font-weight:500;line-height:1;transition:transform .12s,box-shadow .15s,filter .15s;position:relative;transform:translateY(0);box-shadow:0 0 0 2px #080a06,0 8px #00000057,0 0 18px #dfff6714}.play-button:hover:not(:disabled){filter:brightness(1.08)saturate(1.08);transform:translateY(-2px)}.play-button:active:not(:disabled){transform:translateY(6px);box-shadow:0 0 0 2px #080a06,0 2px #00000057,0 0 18px #dfff671f}.play-button:focus-visible{outline:var(--pixel) solid var(--acid-eye);outline-offset:10px}.play-button:disabled{cursor:wait;filter:grayscale(.34)brightness(.72)}.play-button.is-playing{background:linear-gradient(#182a20fa,#050907f5),radial-gradient(#dfff6738,#0000 62%);box-shadow:0 0 0 2px #080a06,0 8px #00000057,0 0 24px #dfff6724}.app-error{max-width:34rem;min-height:1.5rem;color:var(--error);text-align:center;text-shadow:0 2px #120a06;margin:22px 0 0;font-family:ui-monospace,Menlo,Monaco,Consolas,monospace;font-size:14px}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}footer{margin:50px 0 20px}footer a{display:inherit;color:var(--acid-eye);text-align:center;font-family:Inter,sans-serif;font-size:1.25rem;font-weight:300;text-decoration:none}@keyframes title-rise{0%{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}@keyframes member-arrive{0%{opacity:0;transform:translateY(28px)scale(.82)}62%{opacity:1}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes member-idle{0%,to{translate:0}50%{translate:0 -7px}}@keyframes eye-glow{0%{filter:drop-shadow(0 0 #dfff6700)}to{filter:drop-shadow(0 0 3px #dfff67e0)}}@media (max-width:680px){.app-shell{padding:24px 14px}.app-title{font-size:clamp(4.25rem,18vw,5.25rem)}.band-stage{grid-template-columns:repeat(2,minmax(112px,1fr));gap:8px 12px;min-height:430px;padding:26px 12px 42px}.stage-tagline{top:1rem}.creature-sprite{width:118px}.band-member{min-height:166px}.play-button{font-size:3rem}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto;transition-duration:.01ms;animation-duration:.01ms;animation-iteration-count:1}}