@keyframes dash{to{stroke-dashoffset:-22px}}@keyframes draw{0%{stroke-dashoffset:1px}to{stroke-dashoffset:0}}@keyframes growx{0%{transform:scaleX(.05)}to{transform:scaleX(1)}}@keyframes growy{0%{transform:scaleY(.05)}to{transform:scaleY(1)}}@keyframes pop{0%{opacity:.2;transform:translateY(-10px)}to{opacity:1;transform:none}}@keyframes thump{0%{opacity:0;scale:1.8}60%{opacity:1;scale:.94}to{scale:1}}@keyframes blink{50%{opacity:.35}}@keyframes bob{50%{transform:translateY(-5px)}}.showcase{color:#1f2230}.showcase .band{background:var(--bg);color:var(--fg);font-family:var(--body)}.showcase .in{text-align:center;grid-template-columns:minmax(0,1fr);gap:36px;max-width:1080px;margin:0 auto;padding:64px 20px 72px;display:grid}.showcase .num{letter-spacing:.16em;text-transform:uppercase;color:var(--mut);margin:0 0 10px;font:600 11px IBM Plex Mono,monospace}.showcase h2{font-family:var(--head);letter-spacing:var(--ls,-.01em);color:var(--fg);margin:0 0 10px;font-size:clamp(2.1rem,4vw + 1rem,4rem);font-weight:800;line-height:1.05}.showcase .who{color:var(--mut);margin:0;font-size:clamp(17px,1vw + 12px,21px);line-height:1.4}.showcase dl{grid-template-columns:auto 1fr;gap:6px 14px;margin:0;font-size:13.5px;line-height:1.45;display:grid}.showcase dt{color:var(--mut);font-weight:600}.showcase dd{margin:0}.showcase .sw{gap:6px;margin-top:16px;display:flex}.showcase .sw i{border:1px solid var(--line);border-radius:6px;width:26px;height:26px}.showcase svg{width:100%;height:auto;font-size:12px;display:block;overflow:visible}.showcase svg.tall{font-size:13px;display:none}@media (max-width:640px){.showcase svg.wide{display:none}.showcase svg.tall{display:block}}.showcase svg text{font-family:var(--body);fill:var(--fg)}.showcase svg .hd{font-family:var(--head)}.showcase svg .m{fill:var(--mut);font-size:10.5px}.showcase .n{fill:var(--node);stroke:var(--line);stroke-width:1.5px}.showcase .l{stroke:var(--line);stroke-width:1.5px;fill:none}.showcase .af{fill:var(--a)}.showcase .as{stroke:var(--a)}.showcase g.h{cursor:pointer;transition:transform .15s}.showcase g.h:hover .n{stroke:var(--a);stroke-width:2.5px}.showcase g.h:hover{transform:translateY(-2px)}.showcase .tip{color:var(--mut);margin:10px 0 0;font-size:12px}.showcase .c1{--bg:#1e1e2e;--fg:#cdd6f4;--mut:#a6adc8;--node:#313244;--line:#585b70;--a:#fab387;--head:"Fraunces",serif;--body:"Nunito",sans-serif}.showcase .c2{--bg:#143a6b;--fg:#eaf2ff;--mut:#a9c4ea;--node:#ffffff12;--line:#cfe0f7;--a:#ffd166;--head:"Architects Daughter",cursive;--body:"IBM Plex Mono",monospace;background-image:linear-gradient(#ffffff12 1px,#0000 1px),linear-gradient(90deg,#ffffff12 1px,#0000 1px);background-size:24px 24px}.showcase .c3{--bg:#282a36;--fg:#f8f8f2;--mut:#8f9bc4;--node:#21222c;--line:#6272a4;--a:#ff79c6;--head:"JetBrains Mono",monospace;--body:"JetBrains Mono",monospace;--ls:-.03em}.showcase .c4{--bg:#ffe45c;--fg:#111;--mut:#4a4212;--node:#fff;--line:#111;--a:#ff3d8b;--head:"Bricolage Grotesque",sans-serif;--body:"Bricolage Grotesque",sans-serif;--ls:-.03em}.showcase .c4 .n{stroke-width:3px}.showcase .c5{--bg:#c9a676;--fg:#2b1d0e;--mut:#5c4426;--node:#e3c79c;--line:#2b1d0e;--a:#b3261e;--head:"Saira Stencil One",sans-serif;--body:"Courier Prime",monospace;--ls:.02em}.showcase .c6{--bg:#eceff4;--fg:#2e3440;--mut:#5d6779;--node:#fff;--line:#81a1c1;--a:#5e81ac;--head:"Manrope",sans-serif;--body:"Manrope",sans-serif}.showcase .c7{--bg:#faf4ed;--fg:#4a3f5c;--mut:#797593;--node:#fffaf3;--line:#b4637a;--a:#d7827e;--head:"Caveat",cursive;--body:"Lora",serif;--ls:0}.showcase .c7 h2{font-size:clamp(2.8rem,5vw + 1rem,5rem)}.showcase .c8{--bg:#fdf6e3;--fg:#073642;--mut:#657b83;--node:#eee8d5;--line:#586e75;--a:#cb4b16;--head:"IBM Plex Sans",sans-serif;--body:"IBM Plex Mono",monospace}.showcase .c9{--bg:#20382b;--fg:#f4efe1;--mut:#b9c7ae;--node:#2c4a39;--line:#d9c98a;--a:#e8a2a2;--head:"Playfair Display",serif;--body:"DM Sans",sans-serif}.showcase .c10{--bg:#fff1e5;--fg:#262a33;--mut:#66605c;--node:#f2dfce;--line:#262a33;--a:#0d7680;--head:"Newsreader",serif;--body:"Newsreader",serif}.showcase .c11{--bg:#0f0f23;--fg:#e6e6fa;--mut:#8c8cc8;--node:#1a1a3a;--line:#5cff8f;--a:#ff4fd8;--head:"Press Start 2P",monospace;--body:"VT323",monospace;--ls:0}.showcase .c11 h2{font-size:clamp(1.2rem,2.4vw + .6rem,2.4rem);line-height:1.5}.showcase .c11 .who{font-size:24px}.showcase .c11 svg{font-size:16px}.showcase .c11 svg.tall{font-size:19px}.showcase .c11 svg.tall .m{font-size:16px}.showcase .c11 svg .m{font-size:14px}.showcase .c12{--bg:#0b6b3a;--fg:#fffbe6;--mut:#bfe6c9;--node:#0f8548;--line:#ffd84a;--a:#ffd84a;--head:"Bangers",cursive;--body:"DM Sans",sans-serif;--ls:.03em}.showcase .c12 h2{font-size:clamp(2.8rem,5vw + 1rem,5rem);font-weight:400}.showcase .c13{--bg:#ead9b0;--fg:#3b2a14;--mut:#6f5a36;--node:#f3e6c4;--line:#3b2a14;--a:#a3231c;--head:"IM Fell English",serif;--body:"IM Fell English",serif;--ls:0}.showcase .c13 svg{font-size:14px;font-style:italic}.showcase .c14{--bg:#0e1116;--fg:#f2f0ea;--mut:#9aa3b2;--node:#171c24;--line:#39424f;--a:#c8ff4d;--head:"Instrument Serif",serif;--body:"DM Sans",sans-serif;--ls:-.01em}.showcase .c14 h2{font-size:clamp(2.4rem,4.6vw + 1rem,4.6rem);font-weight:400}.showcase .c14 h2 em{color:var(--a)}@media (prefers-reduced-motion:no-preference){.showcase .band:is(:hover,.live) .fl{stroke-dasharray:6 5;animation:1.1s linear infinite dash}.showcase .band:is(:hover,.live) .walk{animation:1.6s linear infinite dash}.showcase .band:is(:hover,.live) .draw{stroke-dasharray:1;animation:1.6s ease-out both draw}.showcase .band:is(:hover,.live) g.h{animation:.5s ease-out backwards pop}.showcase .band:is(:hover,.live) g.h:nth-of-type(2){animation-delay:80ms}.showcase .band:is(:hover,.live) g.h:nth-of-type(3){animation-delay:.16s}.showcase .band:is(:hover,.live) g.h:nth-of-type(4){animation-delay:.24s}.showcase .band:is(:hover,.live) g.h:nth-of-type(5){animation-delay:.32s}.showcase .band:is(:hover,.live) g.h:nth-of-type(n+6){animation-delay:.4s}.showcase .c2 g.h rect,.showcase .c10 g.h path,.showcase .c14 g.h:not([transform])>rect{transform-box:fill-box}.showcase .c2:is(:hover,.live) g.h rect,.showcase .c10:is(:hover,.live) g.h path{transform-origin:0;animation:.9s cubic-bezier(.2,.7,.2,1) both growx;animation-delay:inherit}.showcase .c14:is(:hover,.live) g.h:not([transform])>rect{transform-origin:bottom;animation:.9s cubic-bezier(.2,.7,.2,1) both growy;animation-delay:inherit}.showcase .c14:is(:hover,.live) g.h[transform]{animation:none}.showcase .stamp{transform-box:fill-box;transform-origin:50%}.showcase .c5:is(:hover,.live) .stamp{animation:.5s ease-out .7s both thump}.showcase .c11:is(:hover,.live) g.h:nth-of-type(n+5) rect{animation:1.2s steps(2,end) .6s 3 blink}.showcase .c12:is(:hover,.live) .coins circle{animation:.9s ease-in-out infinite bob}.showcase .c12:is(:hover,.live) .coins circle:nth-child(2){animation-delay:.15s}.showcase .c12:is(:hover,.live) .coins circle:nth-child(3){animation-delay:.3s}}