:root {
  --ink: #0b0910;
  --ink-soft: #18141f;
  --paper: #e9dfcb;
  --paper-bright: #fff7e7;
  --yellow: #ffe600;
  --lime: #86ff00;
  --toxic: #26f6b2;
  --purple: #6b1dff;
  --muted: #aca4b2;
  --line: rgba(255, 255, 255, .15);
  --display: "Bangers", Impact, sans-serif;
  --rough: "Rubik Dirt", "Bangers", Impact, sans-serif;
  --condensed: "Oswald", Impact, sans-serif;
  --mono: "Space Mono", monospace;
  --scribble: "Permanent Marker", cursive;
  --rock: "Rock Salt", cursive;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--paper-bright); background: var(--ink); font-family: var(--condensed); font-size: 17px; letter-spacing: .2px; overflow-x: hidden; }
body::selection { color: var(--ink); background: var(--lime); }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
img { display: block; max-width: 100%; }
.skip-link { position: fixed; z-index: 1000; top: 8px; left: 8px; padding: 10px 14px; color: var(--ink); background: var(--yellow); font-weight: 700; transform: translateY(-150%); transition: transform .2s; }
.skip-link:focus { transform: none; }
.sr-only { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; }

.noise { position: fixed; inset: 0; z-index: 100; pointer-events: none; opacity: .07; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E"); mix-blend-mode: overlay; }

.site-header { height: 88px; padding: 0 clamp(20px, 4vw, 72px); display: flex; align-items: center; gap: 42px; position: sticky; top: 0; z-index: 30; background-color: rgba(11, 9, 16, .96); background-image: radial-gradient(rgba(255,255,255,.055) .7px, transparent .8px); background-size: 6px 6px; border-bottom: 1px solid rgba(255,255,255,.08); box-shadow: 0 8px 0 rgba(0,0,0,.18); backdrop-filter: blur(10px); }
.brand { position: relative; display: grid; grid-template-columns: 48px auto; grid-template-rows: auto auto; align-items: center; column-gap: 5px; width: max-content; color: var(--paper-bright); font: 35px/.82 var(--display); letter-spacing: 1px; transform: rotate(-1.4deg); text-shadow: 2px 2px 0 #333; }
.brand::before { content: "♛"; position: absolute; z-index: 2; color: var(--yellow); font: 19px/1 sans-serif; left: 67px; top: -16px; transform: rotate(9deg); text-shadow: none; }
.brand-skull { grid-row: 1 / 3; display: flex; width: 48px; height: 43px; align-items: center; justify-content: center; }
.brand-skull img { width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(2px 2px 0 #333); }
.brand small { font: 8px/1.2 var(--mono); letter-spacing: 2.5px; margin: 5px 0 0 2px; color: var(--muted); text-shadow: none; }
.site-nav { display: flex; align-items: stretch; gap: 35px; margin: 0 auto; height: 100%; }
.site-nav a { position: relative; display: grid; place-items: center; color: #d7d1d8; font: 600 13px/1 var(--condensed); letter-spacing: .8px; text-transform: uppercase; }
.site-nav a::after { content: ""; position: absolute; height: 3px; left: 50%; right: 50%; bottom: 17px; background: var(--yellow); transition: .25s; }
.site-nav a:hover::after, .site-nav a.active::after { left: 0; right: 0; }
.header-cta { min-width: 190px; }
.header-cta::before { content: "Z"; display: grid; place-items: center; width: 34px; height: 34px; margin-left: -12px; color: var(--yellow); background: var(--ink); border-radius: 50%; font: 700 19px/1 var(--condensed); }
.menu-toggle { display: none; }

.button { min-height: 52px; padding: 0 24px; display: inline-flex; justify-content: center; align-items: center; gap: 24px; border: 0; font: 700 17px/1 var(--condensed); letter-spacing: .8px; text-transform: uppercase; cursor: pointer; clip-path: polygon(3% 4%, 98% 0, 100% 86%, 95% 96%, 2% 100%, 0 15%); transition: transform .2s, filter .2s; }
.button:hover { transform: translateY(-3px) rotate(-1deg); filter: brightness(1.07); }
.button-yellow { color: var(--ink); background: var(--yellow); box-shadow: 9px 9px 0 #000; }
.button span { font-size: 22px; }

.hero { min-height: 760px; height: calc(100svh - 88px); max-height: 900px; position: relative; isolation: isolate; overflow: hidden; border-bottom: 10px solid var(--paper); background-color: var(--ink); background-image: radial-gradient(rgba(255,255,255,.05) .7px, transparent .8px); background-size: 6px 6px; }
.hero::before { content: ""; position: absolute; z-index: 3; left: -2%; right: -2%; bottom: -13px; height: 45px; background: var(--paper); clip-path: polygon(0 44%, 5% 61%, 11% 42%, 17% 69%, 25% 43%, 32% 71%, 39% 49%, 46% 64%, 53% 39%, 61% 69%, 68% 44%, 75% 67%, 83% 38%, 91% 62%, 100% 43%, 100% 100%, 0 100%); }
.hero::after { content: ""; position: absolute; z-index: 2; inset: 0; background: linear-gradient(180deg, transparent 0 49%, rgba(11,9,16,.06) 57%, var(--ink) 63%, var(--ink) 100%); pointer-events: none; }
.hero-backdrop { position: absolute; z-index: -1; inset: 0 0 auto; height: 61%; display: block; }
.hero-backdrop::after { content: ""; position: absolute; inset: auto 0 -5px; height: 54px; background: var(--ink); clip-path: polygon(0 43%, 5% 68%, 11% 45%, 17% 73%, 24% 40%, 32% 70%, 39% 43%, 47% 66%, 55% 37%, 62% 72%, 69% 44%, 78% 65%, 86% 41%, 93% 67%, 100% 44%, 100% 100%, 0 100%); }
.hero-backdrop img { width: 100%; height: 100%; object-fit: cover; object-position: center center; filter: contrast(1.02) saturate(1.02); }
.hero-copy { position: absolute; z-index: 4; left: clamp(24px, 6vw, 105px); bottom: 7%; width: min(600px, 49vw); padding: 28px 25px 15px 0; }
.hero-copy::before { content: ""; position: absolute; z-index: -1; inset: -4% -8% -2% -18%; background: rgba(11,9,16,.94); clip-path: polygon(2% 7%, 97% 0, 100% 91%, 91% 100%, 5% 94%, 0 74%); transform: rotate(-1deg); }
.eyebrow, .section-kicker { color: var(--yellow); font: 700 12px/1 var(--mono); letter-spacing: 2.5px; }
.hero h1 { position: relative; margin: 2px 0; font-family: var(--rough); text-transform: uppercase; font-size: clamp(72px, 8.7vw, 137px); line-height: .74; letter-spacing: -4px; transform: rotate(-2deg); text-shadow: 6px 7px 0 rgba(0,0,0,.65); }
.hero h1 span, .hero h1 em { display: block; }
.hero h1 em { color: var(--lime); font: clamp(34px, 4vw, 62px)/.8 var(--display); letter-spacing: 0; text-align: center; transform: rotate(-2deg); text-shadow: 4px 5px 0 #111; }
.hero-copy-cta { display: none; }
.hero-details { position: absolute; z-index: 5; right: clamp(24px, 5vw, 90px); bottom: 8%; width: min(455px, 37vw); display: grid; grid-template-columns: 120px 1fr; gap: 20px; align-items: center; }
.hero-details p { margin: 0; font: 500 15px/1.4 var(--condensed); }
.hero-details .button { grid-column: 2; justify-self: start; }
.hero-stat { display: flex; flex-direction: column; border-right: 1px solid rgba(255,255,255,.3); }
.hero-stat strong { font: 50px/.9 var(--display); letter-spacing: 1px; }
.hero-stat span { font: 700 15px/1.1 var(--condensed); }
.scroll-cue { position: absolute; z-index: 5; left: 50%; bottom: 24px; transform: translateX(-50%); font-size: 9px; letter-spacing: 2px; }
.scroll-cue span { color: var(--lime); font-size: 17px; }

.paper-section { color: var(--ink); background-color: var(--paper); background-image: radial-gradient(#29232c 0.7px, transparent 0.7px); background-size: 8px 8px; position: relative; }
.lore { min-height: 720px; padding: 90px clamp(25px, 6vw, 110px); display: grid; grid-template-columns: .75fr 1.25fr; gap: 55px; align-items: center; overflow: hidden; }
.lore::before, .faq::before { content: ""; position: absolute; inset: 0; opacity: .15; background: linear-gradient(11deg, transparent 44%, #fff 45%, transparent 47%), linear-gradient(-12deg, transparent 65%, #806f55 66%, transparent 68%); pointer-events: none; }
.lore-copy { position: relative; z-index: 2; max-width: 510px; }
.section-kicker { color: #5a4e59; }
.lore h2, .collection h2, .faq h2, .join-waste h2, .wastelist-intro h1 { margin: 8px 0 25px; font: clamp(58px, 7vw, 110px)/.82 var(--display); text-transform: uppercase; letter-spacing: 1px; }
.lore h2 span, .faq h2 span { color: var(--ink); }
.collection h2 span, .wastelist-intro h1 span { color: var(--purple); }
.lore .lead { font-weight: 700; font-size: 17px; }
.lore-copy > p:not(.section-kicker) { line-height: 1.7; max-width: 530px; }
.warning-stamp { display: flex; align-items: center; gap: 12px; margin-top: 28px; font: 36px/1 var(--display); transform: rotate(-4deg); }
.warning-stamp span { font: 16px/1.15 var(--scribble); }
.lore-art { height: 570px; position: relative; display: flex; justify-content: center; align-items: flex-end; }
.lore-art::before { content: ""; position: absolute; inset: 12% 0 0 7%; background: image-set(url("assets/toxic-wasteland-hero.webp") type("image/webp"), url("assets/toxic-wasteland-hero.png") type("image/png")) center/cover; clip-path: polygon(3% 13%, 92% 0, 100% 83%, 82% 96%, 8% 100%, 0 81%); filter: sepia(.1) saturate(.85); }
.lore-art img { position: relative; z-index: 2; width: min(530px, 72%); filter: drop-shadow(10px 12px 0 rgba(0,0,0,.25)); }
.sun-disc { position: absolute; z-index: 1; width: 285px; height: 285px; border-radius: 50%; background: #ffc400; top: 4%; left: 9%; }
.tape-note { position: absolute; z-index: 3; top: 14%; right: -3%; padding: 18px; font: 21px/.98 var(--display); background: rgba(233,223,203,.86); transform: rotate(2deg); box-shadow: 0 0 0 8px rgba(16,13,19,.08); }
.splatter { position: absolute; width: 220px; height: 220px; background: var(--lime); filter: drop-shadow(0 0 1px #000); }
.splatter-left { left: -120px; top: -70px; clip-path: polygon(45% 0,55% 29%,72% 8%,70% 38%,100% 30%,77% 52%,98% 69%,66% 65%,70% 100%,51% 71%,34% 94%,38% 64%,5% 74%,29% 52%,0 36%,36% 38%); }
.splatter-right { right: -100px; bottom: -70px; clip-path: polygon(45% 0,55% 29%,72% 8%,70% 38%,100% 30%,77% 52%,98% 69%,66% 65%,70% 100%,51% 71%,34% 94%,38% 64%,5% 74%,29% 52%,0 36%,36% 38%); background: #2cff52; }

.collection { padding: 100px clamp(25px, 5vw, 90px) 125px; display: grid; grid-template-columns: 300px 1fr; gap: 50px; background: #111019; position: relative; }
.collection::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, transparent 49.8%, rgba(255,255,255,.025) 50%, transparent 50.2%); background-size: 80px; }
.section-intro, .nft-grid { position: relative; z-index: 2; }
.collection h2 { font-family: var(--rough); font-size: clamp(55px, 5vw, 78px); letter-spacing: -2px; }
.collection h2 span { color: var(--paper-bright); }
.section-intro > p:last-child { color: #d0cad1; font-size: 13px; line-height: 1.7; }
.nft-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; align-items: center; margin: 0; padding: 0; list-style: none; }
.nft-card { padding: 10px 10px 14px; color: var(--ink); background: #eee3ce; box-shadow: 8px 9px 0 rgba(0,0,0,.55); }
.nft-card { transition: transform .25s ease, box-shadow .25s ease; }
.nft-card:hover { z-index: 4; transform: translateY(-12px) rotate(0); box-shadow: 14px 18px 0 rgba(0,0,0,.6); }
.nft-card::before, .nft-card::after { content: ""; position: absolute; width: 55px; height: 22px; background: rgba(211,203,185,.85); top: -11px; transform: rotate(-7deg); }
.nft-card::before { left: 14px; } .nft-card::after { right: 10px; transform: rotate(8deg); }
.nft-card { position: relative; }
.nft-placeholder { aspect-ratio: 1; display: grid; place-content: center; gap: 10px; text-align: center; color: var(--lime); background: radial-gradient(circle at center, #38175e 0, #17121c 60%, #08070b 100%); border: 2px solid #28222a; }
.nft-placeholder span { font: 88px/.7 var(--display); color: rgba(255,255,255,.12); text-shadow: 5px 5px 0 rgba(107,29,255,.35); }
.nft-placeholder small { font-weight: 700; color: #9e92a5; letter-spacing: 2px; }
.nft-meta { display: flex; flex-direction: column; padding-top: 12px; }
.nft-meta strong { font: 20px/1.05 var(--display); letter-spacing: .5px; }
.nft-meta span { font-size: 9px; letter-spacing: 1.5px; color: #4b444d; }
.tilt-left { transform: rotate(-2deg); } .tilt-right { transform: rotate(1.5deg); } .tilt-left-small { transform: rotate(-.5deg); } .tilt-right-small { transform: rotate(2deg); }

.manifesto-strip { min-height: 86px; display: flex; align-items: center; justify-content: space-around; gap: 25px; padding: 15px 30px; color: var(--ink); background: var(--yellow); font: clamp(25px, 3vw, 46px)/1 var(--display); transform: rotate(-1deg) scale(1.02); position: relative; z-index: 3; }
.manifesto-strip i { font-style: normal; }

.faq { padding: 110px clamp(25px, 7vw, 130px); display: grid; grid-template-columns: .8fr 1.2fr; gap: 80px; }
.faq-heading, .faq-list { position: relative; z-index: 2; }
.faq h2 { font-size: clamp(55px, 6vw, 90px); }
.faq-heading > p:last-child { max-width: 400px; line-height: 1.7; }
.faq-list details { border-top: 2px solid var(--ink); }
.faq-list details:last-child { border-bottom: 2px solid var(--ink); }
.faq-list summary { list-style: none; cursor: pointer; padding: 24px 0; display: flex; justify-content: space-between; gap: 20px; font: 25px/1.2 var(--display); text-transform: uppercase; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary span { color: var(--purple); font-size: 35px; transition: transform .2s; }
.faq-list details[open] summary span { transform: rotate(45deg); }
.faq-list details p { margin: -8px 0 28px; max-width: 650px; line-height: 1.7; font-size: 13px; }

.join-waste { padding: 65px clamp(25px, 7vw, 130px); display: grid; grid-template-columns: 1.2fr 1fr auto; align-items: center; gap: 50px; background: #18141f; border-top: 12px solid var(--lime); border-image: linear-gradient(90deg, var(--lime), var(--yellow), var(--lime)) 1; }
.join-waste h2 { margin: 0; font-family: var(--rough); font-size: clamp(54px, 6vw, 90px); color: var(--yellow); letter-spacing: -2px; transform: rotate(-2deg); }
.join-waste p { color: #d3cdd4; font-size: 13px; line-height: 1.7; }

footer { min-height: 125px; padding: 30px clamp(25px, 5vw, 90px); display: flex; align-items: center; gap: 50px; color: #9e96a2; background: #0a080d; border-top: 1px solid rgba(255,255,255,.08); }
.footer-brand { width: 220px; color: var(--paper-bright); }
.footer-links { display: flex; gap: 28px; margin: 0 auto; font-size: 10px; text-transform: uppercase; }
.footer-links a:hover { color: var(--lime); }
footer > p { margin: 0; font-size: 9px; letter-spacing: 1px; text-align: right; }

.reveal { opacity: 0; transform: translateY(24px); transition: opacity .65s ease, transform .65s ease; }
.reveal.visible { opacity: 1; transform: none; }

/* Wastelist */
.wastelist-page { background: #0e0b12; }
.back-home { margin-left: auto; font-size: 11px; font-weight: 700; color: var(--yellow); letter-spacing: 1.5px; }
.wastelist-main { min-height: calc(100vh - 88px); padding-bottom: 100px; background-image: linear-gradient(rgba(11,9,16,.78), rgba(11,9,16,.97)), image-set(url("assets/hero-boneheads-desktop-v2.webp") type("image/webp"), url("assets/hero-boneheads-desktop-v2.png") type("image/png")); background-size: cover; background-position: center top; background-attachment: fixed; }
.wastelist-intro { max-width: 1240px; margin: auto; min-height: 475px; padding: 60px 35px 20px; display: grid; grid-template-columns: 1fr 420px; align-items: center; overflow: hidden; }
.wastelist-intro h1 { font-size: clamp(75px, 9vw, 136px); margin-bottom: 25px; }
.wastelist-intro h1 span { color: var(--lime); }
.wastelist-intro p:last-child { max-width: 620px; color: #d5cfd7; line-height: 1.7; }
.wastelist-intro img { width: 440px; align-self: end; margin-bottom: -100px; filter: drop-shadow(15px 15px 0 rgba(0,0,0,.4)); }
.application-shell { width: min(980px, calc(100% - 40px)); margin: 0 auto; background: var(--paper); color: var(--ink); box-shadow: 16px 18px 0 #000; position: relative; }
.application-shell::before { content: ""; position: absolute; inset: -8px; z-index: -1; background: var(--yellow); clip-path: polygon(1% 0, 99% 1%, 100% 99%, 0 100%); }
.form-tabs { display: flex; border-bottom: 2px solid var(--ink); }
.form-tab { flex: 1; padding: 20px; border: 0; background: #cfc4b0; color: #615967; font-weight: 700; text-transform: uppercase; cursor: pointer; }
.form-tab.active { color: var(--ink); background: var(--paper); }
.tab-panel { display: none; }
.tab-panel.active { display: block; }
.form-progress { position: relative; height: 42px; display: flex; align-items: center; justify-content: center; overflow: hidden; color: var(--paper-bright); background: #29222e; border-bottom: 2px solid var(--ink); }
.form-progress span { position: absolute; inset: 0 100% 0 0; background: var(--purple); transition: right .3s ease; }
.form-progress strong { position: relative; z-index: 1; font: 700 11px/1 var(--mono); letter-spacing: 1.5px; }
.mission-step { display: grid; grid-template-columns: 65px 1fr auto; gap: 22px; align-items: center; padding: 32px 40px; border-bottom: 1px solid rgba(11,9,16,.25); }
.step-number { align-self: start; font: 40px/1 var(--display); color: var(--purple); }
.step-copy h2 { margin: 0 0 6px; font: 26px/1 var(--display); text-transform: uppercase; }
.step-copy p { margin: 0; font-size: 11px; color: #685f6b; }
.mission-link { padding: 12px 16px; color: var(--paper-bright); background: var(--ink); font-size: 11px; font-weight: 700; text-transform: uppercase; }
.mission-step > label, .step-check { grid-column: 2 / -1; }
.mission-step label span { display: block; margin-bottom: 8px; font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: 1.4px; }
.mission-step input:not([type="checkbox"]), .status-form input { width: 100%; min-height: 52px; padding: 0 16px; color: var(--ink); background: var(--paper-bright); border: 2px solid var(--ink); border-radius: 0; outline: none; }
.mission-step input:focus, .status-form input:focus { box-shadow: 5px 5px 0 var(--purple); }
.step-check { display: flex; gap: 10px; align-items: center; font-size: 11px; }
.step-check input { width: 20px; height: 20px; accent-color: var(--purple); }
.step-check label { cursor: pointer; }
.submit-button { margin: 35px 40px; width: calc(100% - 80px); }
.form-message { min-height: 22px; margin: -20px 40px 30px; font-weight: bold; font-size: 12px; text-align: center; }
.form-message.success { color: #0d542f; }
.form-message.error { color: #8a1621; }
.status-panel { padding: 55px; min-height: 390px; }
.status-panel h2 { margin: 8px 0; font: 54px/1 var(--display); text-transform: uppercase; }
.status-panel > p:not(.section-kicker) { color: #685f6b; }
.status-form { display: grid; grid-template-columns: 1fr auto; margin-top: 30px; }
.status-form .button { min-width: 150px; }
.status-result { margin-top: 28px; padding: 0; font-weight: 700; }
.status-result.found { padding: 20px; color: #063721; background: #a5ff67; border: 2px solid var(--ink); }
.status-result.missing { padding: 20px; color: #5a0610; background: #ffb2a6; border: 2px solid var(--ink); }
.privacy-note { width: min(980px, calc(100% - 40px)); margin: 32px auto 0; color: #c4bbc8; font: 700 9px/1.5 var(--mono); text-align: center; letter-spacing: 1.4px; }

.lost-page { min-height: 100svh; display: grid; place-items: center; padding: 25px; background-image: linear-gradient(rgba(11,9,16,.45), rgba(11,9,16,.92)), image-set(url("assets/official-boneheads-banner-source.webp") type("image/webp"), url("assets/official-boneheads-banner-source.png") type("image/png")); background-position: center; background-size: cover; }
.lost-page main { width: min(760px, 100%); padding: clamp(35px, 7vw, 90px); text-align: center; background: rgba(11,9,16,.92); clip-path: polygon(2% 0, 99% 3%, 96% 97%, 4% 100%, 0 62%); }
.lost-page p { color: var(--yellow); font: 700 12px/1 var(--mono); letter-spacing: 3px; }
.lost-page h1 { margin: 10px 0; font: clamp(78px, 13vw, 150px)/.78 var(--rough); text-transform: uppercase; letter-spacing: -5px; }
.lost-page span { display: block; margin-bottom: 30px; color: #c9c1cb; }

@media (max-width: 1050px) {
  .site-nav { gap: 18px; }
  .hero { height: 780px; }
  .hero-details { width: 42vw; }
  .collection { grid-template-columns: 1fr; }
  .section-intro { max-width: 600px; }
  .nft-grid { gap: 14px; }
  .join-waste { grid-template-columns: 1fr 1fr; }
  .join-waste .button { grid-column: 1 / -1; justify-self: start; }
}

@media (max-width: 780px) {
  .site-header { height: 72px; padding: 0 18px; }
  .brand { grid-template-columns: 42px auto; font-size: 31px; }
  .brand::before { left: 60px; top: -15px; font-size: 17px; }
  .brand-skull { width: 42px; height: 38px; }
  .header-cta { display: none; }
  .menu-toggle { display: block; margin-left: auto; padding: 9px 12px; color: var(--ink); background: var(--yellow); border: 0; font-weight: 700; }
  .site-nav { display: none; position: absolute; top: 72px; left: 0; right: 0; height: auto; padding: 20px; flex-direction: column; background: var(--ink); border-bottom: 2px solid var(--yellow); }
  .site-nav.open { display: flex; }
  .site-nav a { padding: 12px; }
  .site-nav a::after { bottom: 5px; }
  .hero { min-height: 820px; height: calc(100svh - 72px); max-height: 960px; }
  .hero::after { background: linear-gradient(180deg, transparent 0 54%, rgba(11,9,16,.16) 60%, var(--ink) 68%, var(--ink) 100%); }
  .hero-backdrop { height: 69%; }
  .hero-backdrop img { object-position: center center; }
  .hero-copy { left: 20px; bottom: 7%; width: calc(100% - 40px); }
  .hero-copy::before { inset: -4% -9% -3% -8%; }
  .hero h1 { font-size: clamp(62px, 18vw, 97px); letter-spacing: -3px; }
  .hero h1 em { text-align: left; padding-left: 50px; }
  .hero-copy-cta { display: inline-flex; margin-top: 24px; }
  .hero-details { display: none; }
  .hero-stat { border: 0; }
  .hero-stat strong { font-size: 34px; }
  .lore { grid-template-columns: 1fr; padding: 75px 22px 0; gap: 20px; }
  .lore-art { height: 460px; margin: 0 -22px; overflow: hidden; }
  .lore-art::before { inset: 8% -15% 0; }
  .lore-art img { width: 430px; }
  .tape-note { right: 10px; font-size: 16px; }
  .collection { padding: 80px 22px; }
  .nft-grid { grid-template-columns: repeat(2, 1fr); }
  .manifesto-strip { overflow: hidden; justify-content: flex-start; white-space: nowrap; }
  .faq { grid-template-columns: 1fr; padding: 80px 22px; gap: 35px; }
  .join-waste { grid-template-columns: 1fr; padding: 55px 22px; gap: 20px; }
  .join-waste .button { grid-column: auto; }
  footer { flex-wrap: wrap; gap: 25px; }
  .footer-links { order: 3; width: 100%; margin: 0; flex-wrap: wrap; }
  footer > p { margin-left: auto; }
  .wastelist-intro { min-height: 390px; padding: 45px 20px 0; grid-template-columns: 1fr 220px; }
  .wastelist-main { background-image: linear-gradient(rgba(11,9,16,.7), rgba(11,9,16,.97)), image-set(url("assets/hero-boneheads-mobile-v4.webp") type("image/webp"), url("assets/hero-boneheads-mobile-v4.png") type("image/png")); background-size: 100% auto; background-repeat: no-repeat; background-attachment: scroll; }
  .wastelist-intro h1 { font-size: clamp(65px, 17vw, 105px); }
  .wastelist-intro p:last-child { font-size: 12px; }
  .wastelist-intro img { width: 330px; max-width: none; margin-left: -50px; margin-bottom: -70px; }
  .application-shell { width: calc(100% - 28px); }
  .privacy-note { width: calc(100% - 28px); }
  .mission-step { grid-template-columns: 48px 1fr; padding: 26px 20px; gap: 14px; }
  .mission-link { grid-column: 2; justify-self: start; }
  .mission-step > label, .step-check { grid-column: 2; }
  .submit-button { margin: 28px 20px; width: calc(100% - 40px); }
  .form-message { margin-inline: 20px; }
  .status-panel { padding: 35px 22px; }
  .status-form { grid-template-columns: 1fr; gap: 10px; }
}

@media (max-width: 500px) {
  .hero { min-height: 760px; }
  .hero::after { background: linear-gradient(180deg, transparent 0 43%, rgba(11,9,16,.16) 51%, var(--ink) 60%, var(--ink) 100%); }
  .hero-backdrop { height: 100vw; max-height: 500px; }
  .hero-backdrop img { object-fit: cover; object-position: center center; }
  .hero-copy { bottom: 5%; }
  .nft-grid { grid-template-columns: 1fr; padding: 0 16px; }
  .nft-card:nth-child(n+3) { display: none; }
  .wastelist-intro { display: block; padding-bottom: 35px; }
  .wastelist-intro img { display: none; }
  .back-home { font-size: 0; }
  .back-home::after { content: "← BACK"; font-size: 10px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .reveal { opacity: 1; transform: none; }
}
.turnstile-wrap {
  min-height: 65px;
  display: flex;
  justify-content: center;
  margin: 1.2rem 0;
}

.submit-button:disabled {
  cursor: wait;
  opacity: 0.65;
}

/* Admin control room */
.admin-page{min-height:100vh;background:#0b0910}.admin-header{position:static}.admin-label{color:var(--yellow);font:700 11px var(--mono);letter-spacing:2px}.admin-logout{margin-left:auto;padding:10px 16px;color:white;border:1px solid #625a67;background:transparent}.admin-main{min-height:calc(100vh - 88px);padding:65px clamp(14px,5vw,80px);background-image:radial-gradient(#ffffff0e .7px,transparent .8px);background-size:6px 6px}.admin-login{width:min(620px,100%);margin:6vh auto;padding:clamp(28px,5vw,55px);color:var(--ink);background:var(--paper);box-shadow:14px 16px #000}.admin-login h1,.admin-title-row h1{margin:8px 0 24px;font:clamp(58px,7vw,100px)/.8 var(--display);text-transform:uppercase}.admin-login h1 span{color:var(--purple)}.admin-login form{display:grid;grid-template-columns:1fr auto;gap:12px;margin-top:25px}.admin-login input,.admin-toolbar input{height:52px;padding:0 15px;border:2px solid var(--ink)}.admin-dashboard{width:min(1440px,100%);margin:auto}.admin-title-row{display:flex;justify-content:space-between;align-items:end}.admin-title-row h1{color:white}.admin-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:28px 0}.admin-stats button{padding:20px;display:flex;justify-content:space-between;color:#aaa2ad;border:1px solid #433b48;background:#17131c}.admin-stats button.active{color:var(--ink);background:var(--yellow)}.admin-stats strong{font:37px var(--display)}.admin-stats span{font:700 10px var(--mono);text-transform:uppercase}.admin-toolbar{display:grid;grid-template-columns:1fr auto;gap:10px}.admin-toolbar input{color:white;border-color:#554c5a;background:#17131c}.admin-toolbar button{padding:0 20px;color:var(--yellow);border:1px solid #554c5a;background:#17131c}.admin-message{min-height:22px;color:#98909c;font:11px var(--mono)}.admin-message.error{color:#ff6262}.admin-table-wrap{overflow-x:auto;border:1px solid #3d3642;background:#110e15}.admin-table{width:100%;min-width:1000px;border-collapse:collapse}.admin-table th,.admin-table td{padding:15px;text-align:left;border-bottom:1px solid #29232e}.admin-table th{color:#8e8592;font:700 9px var(--mono);text-transform:uppercase}.admin-table td{max-width:330px;font:12px var(--mono)}.admin-table strong,.admin-table a{display:block}.admin-table strong{color:white;margin-bottom:7px}.admin-table a{color:var(--yellow)}.admin-wallet{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.status-pending{color:var(--yellow)}.status-approved{color:var(--lime)}.status-rejected{color:#ff6262}.admin-actions{white-space:nowrap}.admin-actions button{width:34px;height:34px;margin-right:5px;color:white;border:1px solid #544b58;background:#201a24}.admin-empty{padding:45px;text-align:center}@media(max-width:780px){.admin-label{display:none}.admin-main{padding:35px 14px}.admin-login form{grid-template-columns:1fr}.admin-title-row{align-items:start;flex-direction:column}.admin-stats{grid-template-columns:repeat(2,1fr)}.admin-toolbar{grid-template-columns:1fr}.admin-toolbar button{min-height:44px}}
