:root {
  --lime: #dfff00;
  --lime-dark: #b9e900;
  --ink: #101210;
  --paper: #f2f0e6;
  --red: #ff4b35;
  --blue: #4c6fff;
  --display: Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif;
  --meme: "Luckiest Guy", "Comic Sans MS", cursive;
  --mono: "Courier New", Courier, monospace;
  --serif: Georgia, "Times New Roman", serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 86px; overflow-x: hidden; }
body { margin: 0; color: var(--ink); background: var(--lime); font-family: var(--mono); overflow-x: hidden; }
a { color: inherit; text-decoration: none; }
button { font: inherit; }
img { max-width: 100%; }
.skip-link { position: fixed; top: -4rem; left: 1rem; background: var(--paper); padding: .8rem; z-index: 100; }
.skip-link:focus { top: 1rem; }

.topbar { position: fixed; z-index: 50; inset: 0 0 auto; width: 100%; min-height: 74px; padding: 0 clamp(.8rem, 2.2vw, 2.2rem); display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: clamp(.8rem, 2vw, 2rem); border-bottom: 2px solid var(--ink); background: rgba(223,255,0,.94); box-shadow: 0 0 0 transparent; backdrop-filter: blur(12px); font-size: .7rem; transition: min-height .2s, box-shadow .2s, background .2s; }
.topbar.scrolled { min-height: 64px; background: rgba(242,240,230,.96); box-shadow: 0 7px 0 rgba(16,18,16,.13); }
.wordmark { display: flex; align-items: center; gap: .55rem; line-height: 1; }
.wordmark > img { width: 42px; height: 42px; flex: none; border: 2px solid var(--ink); border-radius: 50%; background: var(--ink); object-fit: cover; box-shadow: 3px 3px 0 var(--red); transform: rotate(-4deg); transition: transform .2s, box-shadow .2s; }
.wordmark:hover > img, .wordmark:focus-visible > img { transform: rotate(6deg) scale(1.08); box-shadow: 4px 4px 0 var(--lime); }
.wordmark > span { display: grid; gap: .05rem; }
.wordmark b { font: 400 1.35rem var(--meme); letter-spacing: .04em; }
.wordmark small { font: .48rem var(--mono); letter-spacing: .02em; white-space: nowrap; opacity: .65; }
.site-nav { min-width: 0; justify-self: center; display: flex; align-items: stretch; border: 2px solid var(--ink); background: var(--paper); box-shadow: 4px 4px 0 var(--ink); }
.site-nav a { min-height: 38px; padding: .45rem clamp(.45rem, .9vw, .8rem); position: relative; display: flex; align-items: center; gap: .35rem; border-right: 1px solid rgba(16,18,16,.2); font-size: clamp(.48rem, .65vw, .62rem); font-weight: 900; text-transform: uppercase; white-space: nowrap; transition: background .15s, color .15s, transform .15s; }
.site-nav a:last-child { border-right: 0; }
.site-nav a span { color: #73786e; font-size: .42rem; }
.site-nav a:hover, .site-nav a:focus-visible { z-index: 1; background: var(--lime); color: var(--ink); outline: 2px solid var(--ink); outline-offset: -2px; }
.site-nav a.active, .site-nav a[aria-current="location"] { background: var(--ink); color: var(--lime); }
.site-nav a.active span, .site-nav a[aria-current="location"] span { color: var(--paper); }
.site-nav a.active::after, .site-nav a[aria-current="location"]::after { content: ""; width: 7px; height: 7px; position: absolute; left: 50%; bottom: -5px; background: var(--red); border: 1px solid var(--ink); transform: translateX(-50%) rotate(45deg); }
.top-actions { justify-self: end; display: flex; align-items: center; gap: .5rem; }
.pill-link { border: 2px solid var(--ink); border-radius: 99px; padding: .55rem .8rem; background: var(--paper); box-shadow: 3px 3px 0 var(--ink); transition: transform .15s, box-shadow .15s; white-space: nowrap; font-size: .56rem; font-weight: 900; text-transform: uppercase; }
.chart-link { background: var(--ink); color: var(--lime); }
.social-link { min-width: 42px; text-align: center; }
.pill-link:hover, .pill-link:focus-visible { transform: translate(2px, 2px); box-shadow: 1px 1px 0 var(--ink); }
.nav-toggle { width: 48px; height: 40px; padding: .45rem; display: none; place-content: center; gap: 4px; border: 2px solid var(--ink); background: var(--red); color: #fff; box-shadow: 3px 3px 0 var(--ink); cursor: pointer; }
.nav-toggle span { font-size: .45rem; font-weight: 900; text-transform: uppercase; }
.nav-toggle i { width: 22px; height: 2px; display: block; background: currentColor; transition: transform .2s; }
.nav-toggle[aria-expanded="true"] i:first-of-type { transform: translateY(3px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] i:last-of-type { transform: translateY(-3px) rotate(-45deg); }
.nav-progress { height: 4px; position: absolute; inset: auto 0 -4px; overflow: hidden; background: transparent; pointer-events: none; }
.nav-progress i { width: 100%; height: 100%; display: block; background: var(--red); transform: scaleX(0); transform-origin: left; will-change: transform; }

.hero { min-height: 100svh; padding: 7.5rem clamp(1rem, 5vw, 5.5rem) 3rem; position: relative; display: grid; grid-template-columns: 1.1fr .9fr; align-items: center; overflow: hidden; isolation: isolate; background: var(--lime); }
.hero::before { content: ""; position: absolute; inset: 0; opacity: .14; z-index: -1; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 140 140' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.72' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.35'/%3E%3C/svg%3E"); }
.chapter { margin: 0 0 1.2rem; font-size: .69rem; letter-spacing: .08em; }
.hero h1, h2 { font-family: var(--meme); font-weight: 400; letter-spacing: -.025em; line-height: .86; margin: 0; }
.hero h1 { max-width: 10ch; font-family: var(--meme); font-size: clamp(4.1rem, 7.3vw, 8.3rem); font-weight: 400; letter-spacing: -.025em; line-height: .86; text-shadow: 5px 5px 0 rgba(255,255,255,.88); transform: rotate(-1deg); }
.intro { margin: 2rem 0 0; font-family: var(--serif); font-size: clamp(1.2rem, 2vw, 2rem); line-height: 1.25; }
.intro strong { font-family: var(--meme); font-size: 1.8em; font-weight: 400; text-transform: uppercase; }
.brand-summary { max-width: 570px; display: grid; gap: .8rem; font-size: clamp(.95rem, 1.25vw, 1.15rem); line-height: 1.45; }
.brand-summary span:first-child { font-weight: 700; }
.brand-summary span:last-child { color: #394031; }
.buy-block { width: fit-content; margin-top: 1.5rem; position: relative; transform: rotate(-1.2deg); }
.buy-cat { min-width: 300px; min-height: 62px; display: flex; align-items: center; justify-content: space-between; gap: 2rem; padding: .75rem 1.15rem .65rem 1.35rem; border: 3px solid var(--ink); background: var(--red); color: #fff; box-shadow: 7px 7px 0 var(--ink); font: 400 clamp(1.35rem, 2vw, 1.8rem)/1 var(--meme); letter-spacing: .01em; transition: transform .16s, box-shadow .16s, background .16s; }
.buy-cat b { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 50%; background: var(--lime); color: var(--ink); font: 900 1rem var(--mono); }
.buy-cat:hover, .buy-cat:focus-visible { transform: translate(5px,5px) rotate(1deg); box-shadow: 2px 2px 0 var(--ink); background: #ff321b; outline: none; }
.buy-block small { display: block; margin: .75rem 0 0 .35rem; font: italic .7rem var(--serif); }
.tank-wrap { position: relative; display: grid; place-items: center; }
.cat-tank { width: min(41vw, 590px); aspect-ratio: 1; position: relative; padding: .65rem; border-radius: 1.3rem 2.8rem 1.4rem 3.2rem; background: #1b1e1b; border: 5px solid var(--ink); box-shadow: 20px 22px 0 rgba(16,18,16,.17); cursor: pointer; overflow: hidden; transform: rotate(2deg); transition: transform .2s cubic-bezier(.2,.8,.2,1), border-radius .3s; }
.cat-tank:hover, .cat-tank:focus-visible { transform: rotate(-1deg) scale(1.02); border-radius: 2.8rem 1.3rem 3.2rem 1.4rem; }
.cat-tank img { width: 100%; height: 100%; border-radius: .8rem 2.2rem .8rem 2.5rem; object-fit: cover; filter: contrast(1.06); }
.cat-tank.wink { animation: tankWink .48s ease; }
.tank-glare { position: absolute; z-index: 2; width: 35%; height: 16%; top: 12%; left: 16%; border-radius: 50%; border-top: 6px solid rgba(255,255,255,.4); transform: rotate(-18deg); pointer-events: none; }
.tap-label { position: absolute; z-index: 3; bottom: 7%; left: 50%; transform: translateX(-50%) rotate(-2deg); width: max-content; background: var(--paper); border: 2px solid var(--ink); padding: .55rem 1rem; font-size: .67rem; box-shadow: 4px 4px 0 var(--ink); }
.hand-note { position: absolute; right: -1rem; top: 2%; font: italic 1rem var(--serif); transform: rotate(8deg); }
.hand-note::after { content: ""; display: block; width: 75px; height: 45px; border-top: 2px solid var(--ink); border-radius: 50%; transform: rotate(-22deg); }
.tape { position: absolute; z-index: 5; margin: 0; background: var(--red); color: #fff; padding: .7rem 1.5rem; text-transform: uppercase; font-weight: 900; box-shadow: 3px 3px 0 var(--ink); }
.tape-one { left: 1%; top: 8%; transform: rotate(-9deg); }
.wink-log { position: absolute; left: clamp(1rem, 5vw, 5.5rem); bottom: 3rem; display: grid; gap: .25rem; font-size: .65rem; }
.wink-log > span { opacity: .55; }
.wink-log small { font-family: var(--serif); font-style: italic; }
.down-arrow { position: absolute; bottom: 2.8rem; left: 50%; font-size: 2.5rem; animation: bob 1.8s ease-in-out infinite; }
.float-star { position: absolute; font-size: clamp(2rem, 4vw, 5rem); }
.star-a { right: 2%; top: 17%; transform: rotate(17deg); }
.star-b { left: 45%; top: 19%; font-size: 1.5rem; }

.crawl { background: var(--ink); color: var(--lime); border-block: 3px solid var(--ink); overflow: hidden; transform: rotate(-1deg) scale(1.02); }
.crawl div { width: max-content; display: flex; gap: 1.5rem; align-items: center; padding: 1rem 0; font: 2rem var(--display); animation: crawl 25s linear infinite; }
.crawl i { color: var(--paper); font-style: normal; font-size: 1rem; }

.paper { background-color: var(--paper); background-image: linear-gradient(rgba(16,18,16,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(16,18,16,.025) 1px, transparent 1px); background-size: 32px 32px; }
.story { padding: clamp(6rem, 11vw, 12rem) clamp(1rem, 8vw, 9rem); position: relative; }
.margin-note { position: absolute; top: 8rem; right: 3vw; writing-mode: vertical-rl; font-size: .65rem; }
.story article { max-width: 1180px; margin: auto; }
.story h2, .evidence h2 { font-size: clamp(3.7rem, 7.3vw, 8.2rem); }
.split-story { display: grid; grid-template-columns: repeat(2, 1fr); gap: clamp(1rem, 4vw, 4rem); max-width: 900px; margin: 6rem auto; }
.cat-file { min-height: 460px; border: 2px solid var(--ink); padding: 1rem; position: relative; background: #e4e0d4; box-shadow: 8px 8px 0 var(--ink); transform: rotate(-2deg); }
.cat-file.found { transform: rotate(2.5deg); background: var(--lime); }
.file-top { display: flex; justify-content: space-between; border-bottom: 1px solid var(--ink); padding-bottom: .7rem; font-size: .6rem; }
.cashcat { height: 310px; display: grid; place-items: center; font-family: var(--meme); font-size: clamp(3rem, 7vw, 6rem); font-weight: 400; color: #bbb6aa; text-decoration: line-through 7px var(--red); }
.cat-file img { width: 100%; height: 310px; display: block; object-fit: cover; filter: grayscale(1) contrast(1.2); }
.cat-file p { font: italic 1rem var(--serif); }
.stamp { position: absolute; right: 1rem; bottom: 1rem; border: 4px double currentColor; padding: .5rem; color: var(--red); transform: rotate(-8deg); }
.found .stamp { color: var(--blue); transform: rotate(7deg); }
.big-line { margin: 8rem 0 0; font: clamp(3rem, 7vw, 7rem)/1 var(--serif); }
.big-line em { color: var(--red); }

.ink-section { background: var(--ink); color: var(--paper); padding: clamp(6rem, 11vw, 11rem) clamp(1rem, 6vw, 7rem); }
.chapter-row { display: flex; justify-content: space-between; align-items: start; padding-bottom: 1rem; border-bottom: 1px solid #454945; margin-bottom: clamp(4rem, 9vw, 9rem); font-size: .65rem; }
.chapter-row .chapter { margin: 0; }
.discovery-grid { display: grid; grid-template-columns: .8fr 1.2fr; align-items: center; gap: 6vw; }
.discovery h2, .token h2, .community h2 { font-size: clamp(4.5rem, 10vw, 11rem); color: var(--lime); }
.body-copy { max-width: 550px; font: clamp(1.15rem, 1.8vw, 1.55rem)/1.55 var(--serif); }
.body-copy.dim { color: #9ba097; }
.under-link { display: inline-block; margin-top: 2rem; padding-bottom: .4rem; border-bottom: 1px solid var(--lime); color: var(--lime); font-size: .7rem; }
.field-links { max-width: 560px; display: grid; justify-items: start; gap: 1.5rem; }
.reddit-sighting { width: min(100%, 480px); padding: 1rem 1.1rem; position: relative; display: grid; gap: .8rem; border: 2px solid var(--paper); background: #171b17; color: var(--paper); box-shadow: 7px 7px 0 var(--red); transform: rotate(-1deg); transition: transform .16s, box-shadow .16s, background .16s; }
.reddit-sighting::after { content: "r/"; width: 42px; height: 42px; position: absolute; right: 1rem; top: -.8rem; display: grid; place-items: center; border: 2px solid var(--ink); border-radius: 50%; background: var(--red); color: #fff; font: 900 .75rem var(--mono); transform: rotate(8deg); }
.reddit-sighting span { padding-right: 3.2rem; display: flex; justify-content: space-between; gap: 1rem; color: var(--lime); font-size: .54rem; }
.reddit-sighting span i { color: #a8aea7; font-style: normal; }
.reddit-sighting strong { max-width: 30ch; font: italic clamp(1.05rem, 1.5vw, 1.3rem)/1.35 var(--serif); }
.reddit-sighting small { color: #858c84; font-size: .48rem; font-weight: 900; }
.reddit-sighting:hover, .reddit-sighting:focus-visible { background: #202620; box-shadow: 3px 3px 0 var(--lime); transform: translate(4px,4px) rotate(.5deg); outline: none; }
.evidence-photo { margin: 0; position: relative; padding: 1rem; background: var(--paper); color: var(--ink); transform: rotate(2deg); box-shadow: 14px 14px 0 #2b302b; }
.evidence-photo img { display: block; width: 100%; min-height: 360px; object-fit: cover; }
.evidence-photo figcaption { display: flex; gap: 2rem; padding: 1rem .2rem 0; font-size: .62rem; }
.evidence-photo figcaption span { font-weight: 900; }
.pin { position: absolute; width: 16px; height: 16px; border-radius: 50%; background: var(--red); box-shadow: inset -3px -3px 0 rgba(0,0,0,.2), 2px 3px 4px #000; }
.pin-one { top: 5px; left: 7px; }.pin-two { top: 6px; right: 8px; }

.transmissions { background: var(--lime); color: var(--ink); padding: clamp(6rem, 11vw, 11rem) clamp(1rem, 4vw, 4.5rem); }
.transmission-head { display: flex; align-items: end; justify-content: space-between; gap: 3rem; margin-bottom: clamp(4rem, 8vw, 8rem); }
.transmission-head h2 { font-size: clamp(4.5rem, 10vw, 11rem); }
.transmission-head > p { max-width: 330px; font: italic clamp(1rem, 1.4vw, 1.3rem)/1.5 var(--serif); }
.meme-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(1rem, 2.5vw, 2.5rem); align-items: start; }
.meme-card { --resting-angle: -1deg; display: block; padding: 0; border: 3px solid var(--ink); background: var(--paper); color: var(--ink); box-shadow: 8px 8px 0 var(--ink); cursor: zoom-in; overflow: hidden; transform: rotate(var(--resting-angle)); transition: transform .2s, box-shadow .2s; }
.meme-card:nth-child(3n + 2) { --resting-angle: 1.25deg; }
.meme-card:nth-child(3n) { --resting-angle: -.35deg; }
.meme-card:hover, .meme-card:focus-visible { transform: rotate(0) translate(-3px,-3px); box-shadow: 13px 13px 0 var(--red); outline: none; }
.meme-card > span { display: block; padding: .7rem .8rem; border-bottom: 2px solid var(--ink); text-align: left; font-size: .62rem; letter-spacing: .05em; }
.meme-card img { display: block; width: 100%; aspect-ratio: 1; object-fit: cover; background: var(--ink); }
.meme-dialog { width: min(94vw, 920px); max-height: 94vh; padding: 2.5rem 1rem 1rem; border: 3px solid var(--lime); background: var(--ink); color: var(--paper); box-shadow: 18px 18px 0 rgba(0,0,0,.4); overflow: auto; }
.meme-dialog::backdrop { background: rgba(5,8,5,.88); backdrop-filter: blur(7px); }
.meme-dialog img { display: block; max-width: 100%; max-height: calc(94vh - 6rem); margin: auto; object-fit: contain; }
.meme-dialog > p { position: absolute; top: .8rem; left: 1rem; margin: 0; color: var(--lime); font-size: .65rem; }
.dialog-close { position: absolute; top: .55rem; right: .65rem; border: 1px solid var(--paper); background: transparent; color: var(--paper); padding: .35rem .55rem; cursor: pointer; font-size: .62rem; }

.evidence { padding: clamp(6rem, 10vw, 10rem) clamp(1rem, 7vw, 8rem); }
.evidence-stage { min-height: 1100px; display: grid; grid-template-columns: minmax(300px, .75fr) minmax(390px, 1.25fr); align-items: center; gap: clamp(3rem, 8vw, 9rem); color: var(--paper); background: #070a07; background-image: radial-gradient(circle at 72% 43%, rgba(176,255,0,.13), transparent 32%), repeating-linear-gradient(90deg, transparent 0 70px, rgba(157,225,0,.055) 71px 73px), linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px); background-size: auto, auto, 100% 5px; overflow: hidden; }
.evidence-copy { align-self: start; padding-top: 3rem; position: sticky; top: 4rem; }
.evidence-copy h2 { color: var(--lime); text-shadow: 5px 5px 0 #253000; }
.evidence-copy > p:last-child { margin-top: 2rem; font: italic clamp(1rem, 1.5vw, 1.3rem)/1.55 var(--serif); color: #b9c0b4; }
.phone-exhibit { --resting-angle: -1.8deg; width: min(100%, 400px); margin: 3rem auto 2rem; position: relative; transform: rotate(var(--resting-angle)); }
.exhibit-note { width: 96%; min-height: 105px; margin: 0 auto 2.5rem; padding: 1.1rem 1.25rem 1rem; position: relative; z-index: 2; display: grid; gap: .65rem; background: var(--lime); color: #080b07; border: 2px solid #080b07; border-radius: 3px; box-shadow: 6px 7px 0 #314000; transform: rotate(-2deg); }
.exhibit-note::after { content: ""; width: 3px; height: 48px; position: absolute; left: 51%; bottom: -50px; z-index: -1; background: var(--lime); transform: rotate(7deg); }
.exhibit-note b { font-size: .82rem; letter-spacing: .02em; }
.exhibit-note b i { display: inline-block; width: 12px; height: 12px; margin-right: .3rem; border-radius: 50%; background: #17100a; vertical-align: -1px; }
.exhibit-note span { font: italic 1.08rem var(--serif); }
.note-pin { position: absolute; z-index: 4; width: 15px; height: 15px; top: 14px; left: 7%; border-radius: 50%; background: #080b07; box-shadow: inset -3px -3px 0 rgba(255,255,255,.12), 2px 3px 3px rgba(0,0,0,.35); }
.phone-shell { width: 100%; aspect-ratio: 9 / 16; padding: 12px; position: relative; border: 7px solid #11150f; border-radius: 42px; background: #0e0f0e; box-shadow: 0 0 0 4px #52671b, 15px 20px 0 rgba(99,138,0,.24); overflow: hidden; transform: rotate(1deg); }
.phone-shell::after { content: ""; position: absolute; inset: 12px; border-radius: 27px; pointer-events: none; box-shadow: inset 0 0 40px rgba(0,0,0,.22); }
.phone-speaker { position: absolute; z-index: 3; top: 8px; left: 50%; width: 74px; height: 7px; transform: translateX(-50%); border-radius: 10px; background: #292a27; }
.evidence-video { display: block; width: 100%; height: 100%; border-radius: 28px; object-fit: cover; background: #191b1f; }
.sound-toggle { position: absolute; z-index: 5; left: 50%; bottom: 24px; transform: translateX(-50%); border: 2px solid #6d8a18; border-radius: 99px; background: #11150f; color: var(--lime); padding: .65rem 1rem; text-transform: uppercase; font-size: .66rem; font-weight: 900; cursor: pointer; box-shadow: 0 2px 0 #050704; transition: background .18s, transform .18s; }
.sound-toggle:hover, .sound-toggle:focus-visible { background: #11120e; transform: translateX(-50%) translateY(-2px); outline: 2px solid var(--lime); outline-offset: 2px; }
.sound-toggle[aria-pressed="true"] { color: var(--lime); }
.case-number { margin: 1.4rem 0 0; text-align: center; font-size: .58rem; letter-spacing: .06em; color: #a5c94a; }
.archive-card { grid-column: 1 / -1; width: min(920px, 100%); margin: 3rem auto 0; border-block: 1px solid #4c6117; padding: 1.5rem 0; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 1.5rem; color: var(--paper); }
.archive-card > span { width: 52px; height: 52px; display: grid; place-items: center; background: var(--lime); color: #080b07; border-radius: 50%; font-size: 1.4rem; }
.archive-card p { margin: 0; font: 1.05rem var(--serif); }
.archive-card small { display: block; font: .58rem var(--mono); margin-bottom: .35rem; }
.archive-card b { font-size: .66rem; }
.evidence-tape { overflow: hidden; background: var(--red); color: #fff; border-block: 2px solid var(--ink); transform: rotate(1.5deg) scale(1.03); }
.evidence-tape span { display: block; width: max-content; padding: .75rem 0; font-weight: 900; animation: crawl 18s linear infinite reverse; }

.buy-section { padding: clamp(6rem, 10vw, 10rem) clamp(1rem, 7vw, 8rem); color: var(--ink); background: var(--paper); background-image: radial-gradient(circle at 50% 3%, rgba(223,255,0,.42), transparent 17%), linear-gradient(rgba(16,18,16,.035) 1px, transparent 1px); background-size: auto, 100% 32px; }
.buy-section .chapter-row { border-color: rgba(16,18,16,.35); }
.buy-heading { text-align: center; }
.buy-heading h2 { color: var(--ink); font-size: clamp(4rem, 8vw, 8.5rem); }
.buy-heading > p { font: italic 1.1rem var(--serif); }
.coin-cat { width: 150px; height: 150px; margin: -2rem auto 2rem; padding: .45rem; border: 4px solid var(--ink); border-radius: 50%; background: var(--lime); box-shadow: 8px 9px 0 var(--ink); transform: rotate(4deg); }
.coin-cat img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; }
.contract-pill { width: min(820px, 100%); margin: 4rem auto 3rem; display: grid; grid-template-columns: auto 1fr auto; align-items: center; border: 3px solid var(--ink); border-radius: 99px; background: #fff8e8; box-shadow: 7px 8px 0 var(--ink); overflow: hidden; }
.contract-pill > span { padding-left: 1.25rem; color: #777066; font-size: .65rem; letter-spacing: .12em; }
.contract-pill code { min-width: 0; padding: 1rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .7rem; font-weight: 700; }
.copy-button { min-height: 42px; margin-right: .45rem; border: 0; border-radius: 99px; background: var(--ink); color: var(--paper); padding: 0 1.1rem; cursor: pointer; font-weight: 900; white-space: nowrap; }
.copy-button:hover, .copy-button:focus-visible { background: var(--red); outline: 2px solid var(--ink); outline-offset: 2px; }
.buy-steps { max-width: 1120px; margin: 0 auto; display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; align-items: stretch; }
.buy-step { --resting-angle: -1deg; min-height: 255px; padding: 1.4rem; position: relative; border: 3px solid var(--ink); border-radius: 14px; background: #fff8e8; box-shadow: 8px 9px 0 #38352e; transform: rotate(var(--resting-angle)); }
.buy-step:nth-child(2) { --resting-angle: 1deg; }
.buy-step:nth-child(3) { --resting-angle: -.4deg; }
.buy-step > span { color: var(--red); font: 400 1.8rem var(--meme); }
.buy-step h3, .watch-first h3 { margin: .2rem 0 .6rem; font: 400 clamp(1.35rem, 2vw, 1.8rem)/1 var(--meme); }
.buy-step p, .watch-first p { margin: 0 0 1.2rem; font: italic .9rem/1.5 var(--serif); color: #4c4a44; }
.buy-step a { display: inline-block; margin-top: auto; border: 2px solid var(--ink); border-radius: 99px; background: var(--ink); color: var(--paper); padding: .6rem .85rem; font-size: .65rem; font-weight: 900; box-shadow: 3px 3px 0 #817b6e; }
.buy-step .step-buy { background: var(--lime); color: var(--ink); box-shadow: 3px 3px 0 var(--ink); }
.buy-step a:hover, .buy-step a:focus-visible { transform: translate(2px,2px); box-shadow: 1px 1px 0 var(--ink); }
.watch-first { width: min(500px, 100%); margin: 2.4rem auto 4rem; padding: 1.4rem; display: flex; align-items: end; justify-content: space-between; gap: 1rem; border: 3px solid var(--ink); border-radius: 14px; background: #fff8e8; box-shadow: 7px 8px 0 #38352e; transform: rotate(.7deg); }
.watch-first strong { color: var(--red); font: 400 1.8rem var(--meme); }
.watch-first h3 { margin-top: 0; }
.watch-first p { margin-bottom: 0; }
.watch-first a { flex: none; border-radius: 99px; background: var(--ink); color: var(--lime); padding: .7rem .9rem; font-size: .65rem; font-weight: 900; }
.cat-ledger { width: min(760px, 100%); margin: 0 auto; padding: 2rem; position: relative; border: 3px solid var(--ink); background: #fff8e8; box-shadow: 9px 10px 0 var(--red); transform: rotate(-.5deg); }
.cat-ledger::before { content: ""; position: absolute; width: 76px; height: 25px; top: -14px; left: 50%; transform: translateX(-50%) rotate(1deg); background: rgba(196,178,126,.65); border-inline: 1px solid rgba(83,71,42,.25); }
.ledger-head { display: flex; justify-content: space-between; padding-bottom: .8rem; border-bottom: 2px solid var(--ink); font-size: .72rem; }
.ledger-head span { color: #777066; letter-spacing: .12em; }
.cat-ledger dl { margin: 0; }
.cat-ledger dl div { display: flex; justify-content: space-between; gap: 2rem; padding: 1rem 0; border-bottom: 1px solid #c9c2b2; }
.cat-ledger dt { color: #777066; font-size: .65rem; letter-spacing: .12em; }
.cat-ledger dd { margin: 0; font-weight: 900; }
.cat-ledger > p { margin: 1.2rem 0 0; text-align: right; font: italic .75rem var(--serif); color: #656158; }

.caption-wall { padding: clamp(6rem, 10vw, 10rem) clamp(1rem, 5vw, 5.5rem); position: relative; overflow: hidden; background-color: var(--ink); background-image: radial-gradient(circle at 82% 12%, rgba(223,255,0,.14), transparent 24%), linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px); background-size: auto, 34px 34px, 34px 34px; color: var(--paper); }
.caption-wall::before { content: "WRITE IT / PIN IT / POST IT /"; position: absolute; top: 2rem; right: -2rem; color: rgba(223,255,0,.08); font: clamp(3rem, 8vw, 8rem)/.8 var(--meme); transform: rotate(6deg); pointer-events: none; }
.caption-wall-head { max-width: 1180px; margin: 0 auto clamp(3rem, 7vw, 6rem); display: grid; grid-template-columns: 1fr minmax(250px, 420px); align-items: end; gap: 2rem; }
.caption-wall-head .chapter { grid-column: 1 / -1; color: var(--lime); }
.caption-wall-head h2 { color: var(--lime); font-size: clamp(4.8rem, 10vw, 11rem); text-shadow: 7px 7px 0 #283300; transform: rotate(-1deg); }
.caption-wall-head > p:last-child { max-width: 410px; margin: 0 0 .8rem; font: italic clamp(1.1rem, 1.6vw, 1.4rem)/1.5 var(--serif); color: #c8cec3; }
.caption-workbench { max-width: 1050px; margin: 0 auto clamp(5rem, 9vw, 8rem); display: grid; grid-template-columns: minmax(280px, .8fr) minmax(340px, 1.2fr); align-items: center; gap: clamp(1.5rem, 5vw, 5rem); }
.caption-specimen { min-width: 0; margin: 0; padding: .85rem; position: relative; background: var(--paper); color: var(--ink); border: 3px solid var(--lime); box-shadow: 14px 15px 0 #304000; transform: rotate(-2.5deg); }
.caption-specimen::after { content: "caption pending"; position: absolute; top: 46%; right: -3.5rem; padding: .45rem .7rem; background: var(--red); color: #fff; border: 2px solid var(--ink); font-size: .58rem; transform: rotate(8deg); }
.caption-specimen > span { display: block; padding: .2rem .25rem .75rem; font-size: .58rem; letter-spacing: .12em; }
.caption-specimen img { width: 100%; aspect-ratio: 1; display: block; object-fit: cover; background: #17191e; filter: contrast(1.05); }
.caption-specimen figcaption { min-height: 4.5rem; display: grid; place-items: center; padding: 1rem .5rem .4rem; text-align: center; overflow-wrap: anywhere; font: 400 clamp(1.4rem, 3vw, 2.3rem)/1 var(--meme); }
.caption-form { min-width: 0; padding: clamp(1.2rem, 3vw, 2rem); border: 3px solid var(--paper); background: var(--lime); color: var(--ink); box-shadow: 11px 12px 0 var(--red); transform: rotate(.8deg); }
.caption-form-head { display: flex; justify-content: space-between; gap: 1rem; padding-bottom: 1rem; border-bottom: 2px solid var(--ink); font-size: .67rem; }
.caption-form label { display: flex; justify-content: space-between; margin: 1.2rem 0 .45rem; font-size: .65rem; font-weight: 900; text-transform: uppercase; }
.caption-form label span { opacity: .55; font-weight: 400; }
.caption-form textarea, .caption-form input { width: 100%; border: 3px solid var(--ink); border-radius: 0; background: #fffdf3; color: var(--ink); padding: .9rem; font: 1rem/1.45 var(--mono); box-shadow: 4px 4px 0 var(--ink); outline: none; }
.caption-form textarea { min-height: 120px; resize: vertical; }
.caption-form textarea:focus, .caption-form input:focus { box-shadow: 6px 6px 0 var(--red); transform: translate(-2px,-2px); }
.caption-form [aria-invalid="true"] { border-color: var(--red); background: #fff1ed; }
.caption-error { min-height: 1rem; margin: .55rem 0 0; color: #ad1f10; font-size: .61rem; font-weight: 900; }
.caption-error.success { color: #263800; }
.caption-prompts { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .4rem; }
.caption-prompts button { border: 2px solid var(--ink); border-radius: 99px; background: transparent; color: var(--ink); padding: .42rem .65rem; cursor: pointer; font-size: .58rem; }
.caption-prompts button:hover, .caption-prompts button:focus-visible { background: var(--ink); color: var(--lime); outline: none; }
.pin-caption { width: 100%; min-height: 58px; margin-top: 1.4rem; display: flex; align-items: center; justify-content: space-between; border: 3px solid var(--ink); background: var(--red); color: #fff; padding: .7rem 1rem; cursor: pointer; box-shadow: 6px 6px 0 var(--ink); font: 400 1.25rem var(--meme); }
.pin-caption span { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; background: var(--lime); color: var(--ink); font: 900 1.2rem var(--mono); }
.pin-caption:hover, .pin-caption:focus-visible { transform: translate(4px,4px); box-shadow: 2px 2px 0 var(--ink); outline: none; }
.caption-form > small { display: block; margin-top: 1rem; font: italic .75rem/1.4 var(--serif); }
.caption-feed-head { max-width: 1180px; margin: 0 auto 2.5rem; display: flex; justify-content: space-between; align-items: end; border-bottom: 1px solid #485048; padding-bottom: 1rem; }
.caption-feed-head > span { color: var(--lime); font: 400 clamp(2.3rem, 5vw, 4.5rem) var(--meme); }
.caption-feed-head p { margin: 0; color: #aeb5aa; font-size: .62rem; }
.caption-feed { max-width: 1180px; margin: 0 auto; display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(1.2rem, 3vw, 2.5rem); align-items: start; }
.caption-card { --card-angle: -1.2deg; min-height: 225px; padding: 1.4rem; position: relative; display: flex; flex-direction: column; border: 3px solid var(--ink); background: var(--paper); color: var(--ink); box-shadow: 8px 9px 0 var(--lime); transform: rotate(var(--card-angle)); transition: transform .18s, box-shadow .18s; }
.caption-card:nth-child(3n + 2) { --card-angle: 1.3deg; background: var(--lime); box-shadow: 8px 9px 0 var(--red); }
.caption-card:nth-child(3n) { --card-angle: -.25deg; box-shadow: 8px 9px 0 var(--blue); }
.caption-card::before { content: ""; width: 64px; height: 20px; position: absolute; top: -11px; left: 50%; background: rgba(236,220,170,.72); border-inline: 1px solid rgba(30,30,20,.25); transform: translateX(-50%) rotate(-2deg); }
.caption-card:hover { transform: rotate(0) translateY(-5px); box-shadow: 11px 14px 0 var(--red); }
.caption-card blockquote { margin: .8rem 0 1.5rem; flex: 1; overflow-wrap: anywhere; font: 400 clamp(1.45rem, 2.4vw, 2.15rem)/1.05 var(--meme); }
.caption-card-meta { display: flex; justify-content: space-between; gap: 1rem; padding-top: .8rem; border-top: 1px solid rgba(16,18,16,.3); font-size: .58rem; }
.caption-card-actions { display: flex; gap: .45rem; margin-top: 1rem; }
.caption-card-actions button, .caption-card-actions a { border: 2px solid var(--ink); border-radius: 99px; background: transparent; color: var(--ink); padding: .45rem .7rem; cursor: pointer; font-size: .58rem; font-weight: 900; }
.caption-card-actions button:hover, .caption-card-actions button:focus-visible, .caption-card-actions a:hover, .caption-card-actions a:focus-visible { background: var(--ink); color: var(--lime); outline: none; }
.caption-card-actions button:disabled { opacity: .55; cursor: wait; }
.caption-card-actions .caption-remove { margin-left: auto; border-color: transparent; opacity: .55; }
.caption-card.new-caption { animation: pinDrop .6s cubic-bezier(.18,.89,.32,1.28); }

.pfp-maker { padding: clamp(6rem, 11vw, 11rem) clamp(1rem, 6vw, 7rem); position: relative; overflow: hidden; background: var(--paper); background-image: linear-gradient(rgba(16,18,16,.045) 1px, transparent 1px), linear-gradient(90deg, rgba(16,18,16,.04) 1px, transparent 1px); background-size: 28px 28px; }
.pfp-maker::before { content: "IDENTITY VERIFIED?"; position: absolute; right: -3rem; top: 3rem; color: rgba(16,18,16,.055); font: clamp(4rem, 10vw, 11rem)/.8 var(--meme); transform: rotate(7deg); white-space: nowrap; pointer-events: none; }
.pfp-heading { max-width: 1180px; margin: 0 auto clamp(3rem, 7vw, 6rem); display: grid; grid-template-columns: minmax(0, 1fr) minmax(250px, 390px); align-items: end; gap: 2rem; }
.pfp-heading .chapter { grid-column: 1 / -1; }
.pfp-heading h2 { max-width: 8ch; color: var(--ink); font-size: clamp(4.7rem, 9vw, 10rem); text-shadow: 7px 7px 0 var(--lime); transform: rotate(-1deg); }
.pfp-heading > p:last-child { margin: 0 0 .8rem; font: italic clamp(1.05rem, 1.6vw, 1.35rem)/1.5 var(--serif); }
.pfp-machine { max-width: 1120px; margin: auto; display: grid; grid-template-columns: minmax(320px, .95fr) minmax(360px, 1.05fr); align-items: center; gap: clamp(2rem, 6vw, 6rem); }
.pfp-stage { width: min(100%, 520px); min-width: 0; margin-inline: auto; position: relative; isolation: isolate; }
.pfp-stage::before, .pfp-stage::after { content: ""; position: absolute; z-index: -1; border-radius: 50%; pointer-events: none; }
.pfp-stage::before { inset: -18px; border: 3px dashed var(--ink); animation: pfpOrbit 28s linear infinite; }
.pfp-stage::after { inset: -34px; border: 5px solid var(--red); clip-path: polygon(0 0, 46% 0, 46% 12%, 54% 12%, 54% 0, 100% 0, 100% 46%, 88% 46%, 88% 54%, 100% 54%, 100% 100%, 54% 100%, 54% 88%, 46% 88%, 46% 100%, 0 100%, 0 54%, 12% 54%, 12% 46%, 0 46%); transform: rotate(7deg); }
.pfp-stage > p { margin: 1rem 0 0; text-align: center; font: italic .78rem var(--serif); }
.pfp-screen { aspect-ratio: 1; padding: clamp(.55rem, 1.3vw, .85rem); position: relative; border: 7px solid var(--ink); border-radius: 50%; background: var(--lime); box-shadow: 0 0 0 6px var(--paper), 0 0 0 12px var(--ink), 15px 17px 0 var(--lime), 20px 22px 0 var(--ink); transform: rotate(-1.5deg); }
.pfp-screen::before, .pfp-screen::after { position: absolute; z-index: 4; padding: .48rem .65rem; border: 3px solid var(--ink); background: var(--lime); color: var(--ink); box-shadow: 4px 4px 0 var(--ink); font-size: .55rem; font-weight: 900; letter-spacing: .05em; white-space: nowrap; }
.pfp-screen::before { content: "X PFP READY"; left: -4%; top: 12%; transform: rotate(-11deg); }
.pfp-screen::after { content: "STILL WINKING"; right: -5%; bottom: 15%; background: var(--red); color: #fff; transform: rotate(8deg); }
.pfp-screen canvas { width: 100%; aspect-ratio: 1; display: block; border-radius: 50%; background: #050706; cursor: grab; touch-action: none; }
.pfp-screen canvas:active { cursor: grabbing; }
.pfp-live-dot, .pfp-size { position: absolute; z-index: 3; bottom: 8%; padding: .42rem .56rem; border: 2px solid var(--ink); background: var(--lime); color: var(--ink); box-shadow: 3px 3px 0 var(--ink); font-size: .5rem; font-weight: 900; }
.pfp-live-dot { left: 13%; }
.pfp-live-dot::before { content: ""; width: 7px; height: 7px; display: inline-block; margin-right: .4rem; border-radius: 50%; background: var(--red); animation: pfpBlink 1.2s steps(1) infinite; }
.pfp-size { right: 13%; background: var(--paper); }
.pfp-controls { min-width: 0; padding: clamp(1.3rem, 3vw, 2.2rem); border: 4px solid var(--ink); background: var(--lime); box-shadow: 12px 13px 0 var(--red); transform: rotate(.8deg); }
.pfp-control-head { display: flex; justify-content: space-between; gap: 1rem; padding-bottom: 1rem; border-bottom: 2px solid var(--ink); font-size: .63rem; }
.pfp-control-head span { opacity: .58; }
.pfp-upload { display: block; margin-top: 1.4rem; cursor: pointer; }
.pfp-upload > span, .pfp-styles legend, .pfp-zoom > span { display: block; margin-bottom: .6rem; font-size: .63rem; font-weight: 900; text-transform: uppercase; }
.pfp-upload strong { min-height: 58px; display: flex; align-items: center; justify-content: space-between; padding: .7rem .8rem .7rem 1rem; border: 3px solid var(--ink); background: var(--paper); box-shadow: 5px 5px 0 var(--ink); font: 400 1.15rem var(--meme); transition: transform .15s, box-shadow .15s; }
.pfp-upload:hover strong, .pfp-upload:focus-within strong { transform: translate(3px,3px); box-shadow: 2px 2px 0 var(--ink); }
.pfp-upload strong b { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; background: var(--red); color: #fff; font: 900 1.2rem var(--mono); }
.pfp-controls > input[type="file"] { width: 1px; height: 1px; position: absolute; opacity: 0; pointer-events: none; }
.pfp-message { min-height: 1rem; margin: .75rem 0 0; font: italic .7rem var(--serif); }
.pfp-message.error { color: #a51d11; font-weight: 900; }
.pfp-styles { margin: 1.4rem 0 0; padding: 0; border: 0; }
.pfp-styles div { display: grid; grid-template-columns: repeat(3, 1fr); gap: .55rem; }
.pfp-styles button { min-height: 78px; padding: .65rem .35rem; border: 2px solid var(--ink); background: transparent; color: var(--ink); cursor: pointer; font-size: .54rem; font-weight: 900; line-height: 1.25; }
.pfp-styles button i { width: 22px; height: 22px; display: block; margin: 0 auto .5rem; border: 3px solid currentColor; border-radius: 50%; box-shadow: inset 0 0 0 3px var(--lime); }
.pfp-styles button:nth-child(1) i { transform: rotate(-12deg); border-radius: 3px; }
.pfp-styles button:nth-child(2) i { clip-path: polygon(0 70%, 18% 51%, 36% 62%, 56% 24%, 73% 38%, 100% 0, 100% 100%, 0 100%); border-radius: 0; }
.pfp-styles button:nth-child(3) i { border-style: dashed; }
.pfp-styles button[aria-pressed="true"] { background: var(--ink); color: var(--lime); box-shadow: 4px 4px 0 var(--red); transform: translate(-2px,-2px); }
.pfp-zoom { display: block; margin-top: 1.4rem; }
.pfp-zoom input { width: 100%; accent-color: var(--red); cursor: ew-resize; }
.pfp-actions { margin-top: 1.5rem; display: grid; grid-template-columns: auto 1fr; gap: .7rem; }
.pfp-actions button { min-height: 56px; border: 3px solid var(--ink); background: transparent; color: var(--ink); padding: .7rem 1rem; cursor: pointer; font-size: .62rem; font-weight: 900; box-shadow: 4px 4px 0 var(--ink); }
.pfp-actions .pfp-download { display: flex; align-items: center; justify-content: space-between; background: var(--red); color: #fff; font: 400 1.05rem var(--meme); }
.pfp-download span { color: var(--lime); font: 900 1.2rem var(--mono); }
.pfp-actions button:hover, .pfp-actions button:focus-visible { transform: translate(3px,3px); box-shadow: 1px 1px 0 var(--ink); outline: none; }

.community { min-height: 100svh; padding: clamp(6rem, 11vw, 11rem) clamp(1rem, 6vw, 7rem); text-align: center; display: flex; flex-direction: column; align-items: center; justify-content: center; position: relative; overflow: hidden; background: var(--blue); color: var(--paper); }
.community h2 { color: var(--lime); }
.community > p:not(.chapter):not(.final-day) { font: clamp(1.1rem, 2vw, 1.7rem)/1.4 var(--serif); }
.big-social { width: min(800px, 90vw); margin: 3rem 0; padding: 1.4rem 2rem; display: flex; justify-content: space-between; border: 2px solid var(--paper); background: var(--red); color: #fff; font-weight: 900; box-shadow: 8px 8px 0 var(--ink); transition: transform .15s, box-shadow .15s; }
.big-social:hover, .big-social:focus-visible { transform: translate(5px,5px); box-shadow: 3px 3px 0 var(--ink); }
.final-cat { width: 130px; height: 130px; padding: 0; border: 4px solid var(--paper); border-radius: 50%; overflow: hidden; background: var(--ink); cursor: pointer; }
.final-cat img { width: 100%; height: 100%; object-fit: cover; transition: transform .2s; }
.final-cat:hover img { transform: scale(1.1) rotate(5deg); }
.final-day { font-size: .66rem; }

footer { background: var(--ink); color: var(--paper); padding: 2rem clamp(1rem, 4vw, 4rem); display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 2rem; }
footer > span { font: 2rem var(--display); color: var(--lime); }
footer > p { font: italic .9rem var(--serif); }
footer > div { display: flex; gap: 1rem; font-size: .65rem; }
footer > small { grid-column: 1 / -1; border-top: 1px solid #333833; padding-top: 1rem; color: #888e86; font-size: .52rem; }
.toast { position: fixed; z-index: 100; bottom: 1.5rem; left: 50%; transform: translate(-50%, 150%); background: var(--paper); border: 2px solid var(--ink); box-shadow: 5px 5px 0 var(--ink); padding: 1rem; font-size: .7rem; transition: transform .25s; }
.toast.show { transform: translate(-50%, 0); }
.hunt-zone { position: relative; }
.hidden-cat { width: 48px; height: 48px; padding: 3px; position: absolute; z-index: 8; border: 2px solid var(--ink); border-radius: 50%; background: var(--lime); box-shadow: 3px 3px 0 var(--ink); opacity: .2; cursor: pointer; transform: rotate(-9deg); transition: opacity .2s, transform .2s, box-shadow .2s; }
.hidden-cat img { width: 100%; height: 100%; display: block; border-radius: 50%; object-fit: cover; }
.hidden-cat:hover, .hidden-cat:focus-visible { opacity: 1; transform: rotate(4deg) scale(1.12); box-shadow: 5px 5px 0 var(--red); outline: 2px solid var(--lime); outline-offset: 3px; }
.hidden-cat.on-dark { border-color: var(--lime); box-shadow: 3px 3px 0 var(--lime); }
.hidden-cat.found { opacity: .72; pointer-events: none; filter: grayscale(1); transform: scale(.82); }
.hidden-cat.found::after { content: "✓"; width: 20px; height: 20px; position: absolute; right: -7px; bottom: -5px; display: grid; place-items: center; border: 2px solid var(--ink); border-radius: 50%; background: var(--lime); color: var(--ink); font-size: .65rem; font-weight: 900; }
.cat-one { top: 16%; left: 46%; }
.cat-two { top: 42%; right: 2.5%; }
.cat-three { bottom: 9%; left: 2%; }
.cat-four { top: 28%; right: 1.5%; }
.cat-five { bottom: 7%; left: 3%; }
.cat-hunt-status { position: fixed; z-index: 45; right: 1.2rem; bottom: 1.2rem; min-height: 48px; display: flex; align-items: center; gap: .65rem; border: 2px solid var(--ink); border-radius: 99px; background: var(--lime); color: var(--ink); padding: .35rem .8rem .35rem .4rem; box-shadow: 4px 4px 0 var(--ink); cursor: pointer; font-size: .62rem; font-weight: 900; text-transform: uppercase; transition: transform .18s, box-shadow .18s; }
.cat-hunt-status img { width: 34px; height: 34px; border-radius: 50%; object-fit: cover; }
.cat-hunt-status:hover, .cat-hunt-status:focus-visible { transform: translateY(-3px); box-shadow: 6px 6px 0 var(--red); outline: none; }
.cat-hunt-status.pop { animation: huntPop .45s ease; }
.cat-hunt-status.complete { background: var(--red); color: #fff; }
.secret-dialog { width: min(92vw, 760px); max-height: 94vh; padding: clamp(1.2rem, 4vw, 3rem); border: 4px solid var(--lime); background: var(--ink); color: var(--paper); box-shadow: 15px 15px 0 var(--red); text-align: center; overflow: auto; }
.secret-dialog::backdrop { background: rgba(4,6,4,.9); backdrop-filter: blur(8px); }
.secret-dialog h2 { color: var(--lime); font-size: clamp(3.5rem, 8vw, 7rem); }
.secret-dialog > p:not(.chapter) { font: italic 1.1rem var(--serif); }
.secret-dialog > img { width: min(100%, 470px); display: block; margin: 2rem auto; border: 3px solid var(--lime); box-shadow: 8px 8px 0 var(--red); }
.secret-close { position: absolute; right: .8rem; top: .8rem; border: 1px solid var(--paper); background: transparent; color: var(--paper); padding: .4rem .6rem; cursor: pointer; font-size: .62rem; }
.secret-actions { display: flex; justify-content: center; gap: .8rem; flex-wrap: wrap; }
.secret-actions a { border: 2px solid var(--paper); background: var(--lime); color: var(--ink); padding: .8rem 1rem; font-size: .67rem; font-weight: 900; box-shadow: 4px 4px 0 var(--red); }
.secret-actions a:last-child { background: var(--paper); }
.reveal { opacity: 0; transform: translateY(24px) rotate(.01deg); transition: opacity .65s, transform .65s cubic-bezier(.2,.8,.2,1); }
.reveal.visible { opacity: 1; transform: translateY(0) rotate(var(--resting-angle, 0deg)); }

@keyframes tankWink { 0%,100% { transform: rotate(2deg) scale(1); } 40% { transform: rotate(-4deg) scale(.96, .86); } 70% { transform: rotate(3deg) scale(1.03); } }
@keyframes crawl { to { transform: translateX(-50%); } }
@keyframes bob { 50% { transform: translateY(8px); } }
@keyframes huntPop { 40% { transform: scale(1.15) rotate(-3deg); } 75% { transform: scale(.96) rotate(2deg); } }
@keyframes pinDrop { 0% { opacity: 0; transform: translateY(-45px) rotate(-7deg) scale(1.08); } 65% { opacity: 1; transform: translateY(5px) rotate(2deg) scale(.98); } 100% { transform: rotate(var(--card-angle)); } }
@keyframes pfpBlink { 50% { opacity: .25; } }
@keyframes pfpOrbit { to { transform: rotate(360deg); } }

@media (max-width: 850px) {
  html { scroll-padding-top: 76px; }
  .topbar, .topbar.scrolled { min-height: 66px; grid-template-columns: auto 1fr auto; }
  .site-nav { position: fixed; z-index: 55; inset: 74px .8rem auto; display: grid; grid-template-columns: repeat(2, 1fr); opacity: 0; visibility: hidden; transform: translateY(-16px) rotate(-1deg); transition: opacity .18s, visibility .18s, transform .18s; pointer-events: none; box-shadow: 8px 9px 0 var(--red); }
  .topbar.scrolled .site-nav { top: 66px; }
  .site-nav.open { opacity: 1; visibility: visible; transform: translateY(0) rotate(0); pointer-events: auto; }
  .site-nav a { min-height: 54px; padding: .8rem; border-right: 1px solid rgba(16,18,16,.2); border-bottom: 1px solid rgba(16,18,16,.2); font-size: .68rem; }
  .site-nav a:nth-child(even) { border-right: 0; }
  .site-nav a:nth-last-child(-n + 2) { border-bottom: 0; }
  .site-nav a.active::after, .site-nav a[aria-current="location"]::after { left: auto; right: .7rem; bottom: 50%; transform: translateY(50%) rotate(45deg); }
  .nav-toggle { display: grid; }
  .top-actions { grid-column: 3; }
  .hero { grid-template-columns: 1fr; align-content: center; gap: 2rem; padding-top: 6rem; }
  .hero-copy { position: relative; z-index: 2; }
  .hero h1 { font-size: clamp(3.55rem, 13.5vw, 6.2rem); }
  .tank-wrap { position: absolute; right: -18%; bottom: 12%; opacity: .68; }
  .cat-tank { width: min(75vw, 520px); }
  .tap-label, .hand-note, .tape-one { display: none; }
  .wink-log { bottom: 2rem; z-index: 3; }
  .down-arrow { left: auto; right: 1.5rem; bottom: 2rem; }
  .split-story, .discovery-grid { grid-template-columns: 1fr; }
  .buy-steps { grid-template-columns: 1fr; max-width: 560px; }
  .caption-wall-head { grid-template-columns: 1fr; }
  .caption-workbench { grid-template-columns: minmax(0, 1fr); max-width: 620px; }
  .caption-specimen { width: min(80%, 420px); margin-inline: auto; }
  .caption-feed { grid-template-columns: repeat(2, 1fr); }
  .pfp-heading { grid-template-columns: 1fr; }
  .pfp-machine { grid-template-columns: minmax(0, 1fr); max-width: 620px; }
  .pfp-stage { width: min(86%, 500px); margin-inline: auto; }
  .buy-step { min-height: 0; }
  .meme-grid { grid-template-columns: repeat(2, 1fr); }
  .transmission-head { display: block; }
  .transmission-head > p { margin-top: 2rem; }
  .discovery-grid, .token-grid { gap: 5rem; }
  .evidence-photo { margin-top: 2rem; }
  .evidence-stage { grid-template-columns: 1fr; }
  .evidence-copy { position: static; padding-top: 0; }
  .phone-exhibit { margin-top: 1rem; }
  footer { grid-template-columns: 1fr; }
  footer > small { grid-column: auto; }
}

@media (max-width: 520px) {
  .topbar, .topbar.scrolled { min-height: 62px; padding-inline: .65rem; display: flex; justify-content: space-between; gap: .45rem; }
  .wordmark b { font-size: 1.15rem; }
  .wordmark > img { width: 34px; height: 34px; box-shadow: 2px 2px 0 var(--red); }
  .wordmark small { display: none; }
  .top-actions { margin: 0; position: absolute; right: .65rem; top: 50%; gap: .35rem; transform: translateY(-50%); }
  .pill-link { padding: .48rem .62rem; font-size: .52rem; }
  .social-link, .chart-link { display: none; }
  .site-nav, .topbar.scrolled .site-nav { inset: 66px .65rem auto; grid-template-columns: 1fr; max-height: calc(100svh - 82px); overflow-y: auto; }
  .site-nav a, .site-nav a:nth-child(even), .site-nav a:nth-last-child(-n + 2) { min-height: 48px; border-right: 0; border-bottom: 1px solid rgba(16,18,16,.2); }
  .site-nav a:last-child { border-bottom: 0; }
  .hero { min-height: 760px; padding-inline: 1rem; }
  .hero h1 { max-width: 100%; font-size: clamp(3.05rem, 13.5vw, 3.7rem); text-shadow: 3px 3px 0 rgba(255,255,255,.88); }
  .brand-summary { max-width: 87%; font-size: .88rem; }
  .buy-cat { min-width: min(300px, 86vw); min-height: 56px; font-size: 1.25rem; }
  .intro { font-size: 1.2rem; }
  .tank-wrap { right: -42%; bottom: 12%; opacity: .5; }
  .cat-tank { width: 92vw; }
  .star-a { top: 11%; }
  .crawl div { font-size: 1.45rem; }
  .margin-note { display: none; }
  .story h2, .evidence h2 { font-size: 4rem; }
  .split-story { margin-block: 4rem; }
  .cat-file { min-height: 400px; }
  .cashcat, .cat-file img { height: 260px; }
  .big-line { margin-top: 6rem; font-size: 3rem; }
  .discovery h2, .token h2, .community h2 { font-size: 4.35rem; }
  .evidence-photo img { min-height: 220px; }
  .meme-grid { grid-template-columns: 1fr; gap: 1.5rem; }
  .evidence-photo figcaption { display: block; line-height: 1.5; }
  .evidence-stage { min-height: 0; }
  .phone-exhibit { width: min(84vw, 380px); }
  .exhibit-note { min-height: 90px; }
  .archive-card { grid-template-columns: auto 1fr; }
  .archive-card b { grid-column: 2; }
  .contract-pill { grid-template-columns: auto 1fr; border-radius: 18px; }
  .contract-pill code { font-size: .6rem; }
  .contract-pill .copy-button { grid-column: 1 / -1; width: calc(100% - .8rem); margin: 0 .4rem .4rem; min-height: 45px; }
  .watch-first { display: block; }
  .watch-first a { display: inline-block; margin-top: 1rem; }
  .cat-ledger { padding: 1.3rem; }
  .caption-wall-head h2 { font-size: 4.35rem; }
  .caption-specimen { width: 94%; }
  .caption-specimen::after { right: .25rem; }
  .caption-form { transform: none; box-shadow: 7px 8px 0 var(--red); }
  .pin-caption { gap: .35rem; padding-inline: .7rem; font-size: .88rem; }
  .pin-caption span { flex: none; }
  .caption-feed-head { display: block; }
  .caption-feed-head p { margin-top: .5rem; }
  .caption-feed { grid-template-columns: 1fr; }
  .caption-card { min-height: 200px; transform: rotate(0); }
  .caption-card-meta { flex-wrap: wrap; }
  .pfp-heading h2 { font-size: 4.1rem; }
  .pfp-stage { width: 94%; }
  .pfp-controls { transform: none; box-shadow: 8px 9px 0 var(--red); }
  .pfp-styles div { grid-template-columns: 1fr; }
  .pfp-styles button { min-height: 52px; display: flex; align-items: center; justify-content: flex-start; gap: .7rem; padding-inline: .8rem; }
  .pfp-styles button i { margin: 0; flex: none; }
  .pfp-actions { grid-template-columns: 1fr; }
  .big-social { padding-inline: 1rem; font-size: .7rem; }
  .hidden-cat { width: 42px; height: 42px; }
  .cat-one { left: auto; right: 3%; top: 13%; }
  .cat-two { right: -8px; }
  .cat-three { left: -8px; }
  .cat-four { right: -8px; }
  .cat-five { left: -8px; }
  .cat-hunt-status { right: .7rem; bottom: .7rem; }
  .secret-dialog { box-shadow: 8px 8px 0 var(--red); }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .reveal { opacity: 1; transform: none; }
}