:root {
  --cream: #f6efe5;
  --paper: #fffaf3;
  --pink: #e9b6aa;
  --pink-deep: #c98176;
  --lime: #8dbd27;
  --lime-bright: #b6e233;
  --blue: #1649c8;
  --blue-deep: #0c2873;
  --ink: #17191c;
  --orange: #e9a84f;
  --muted: #6e6e69;
  --border: rgba(23,25,28,.18);
  --shadow: 0 28px 80px rgba(34,29,25,.18);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; min-width: 1100px; }
body {
  margin: 0;
  background: var(--cream);
  color: var(--ink);
  font-family: "Trebuchet MS", "Arial Rounded MT Bold", Arial, sans-serif;
  overflow-x: hidden;
  min-width: 1100px;
}
body::selection { background: var(--lime-bright); color: var(--ink); }
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button, a { -webkit-tap-highlight-color: transparent; }
button { font: inherit; }

.page-noise {
  position: fixed; inset: 0; pointer-events: none; z-index: 99; opacity: .05;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180' viewBox='0 0 180 180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.84' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E");
  mix-blend-mode: multiply;
}
.cursor-glow {
  position: fixed; width: 360px; height: 360px; border-radius: 50%; pointer-events: none; z-index: 2;
  background: radial-gradient(circle, rgba(182,226,51,.12), rgba(182,226,51,0) 68%);
  transform: translate(-50%,-50%); transition: opacity .2s ease; opacity: 0;
}

.section-shell { position: relative; min-height: 920px; padding: 34px 4.2vw 70px; }
.section-number {
  font-size: 12px; letter-spacing: .18em; font-weight: 800; text-transform: uppercase;
  border-top: 1px solid var(--border); padding-top: 14px; width: 220px;
}
.section-number.light { color: rgba(255,255,255,.8); border-color: rgba(255,255,255,.28); }
.eyebrow { margin: 0 0 22px; font-size: 12px; letter-spacing: .19em; font-weight: 900; text-transform: uppercase; color: var(--blue-deep); }
.eyebrow.light { color: #dff48c; }
.eyebrow.dark { color: var(--blue-deep); }

.hero {
  min-height: 100vh; overflow: hidden; background: #f0d9d0;
  isolation: isolate;
}
.hero-bg {
  position: absolute; inset: -5%; z-index: -4;
  background:
    linear-gradient(90deg, rgba(246,239,229,.96) 0%, rgba(246,239,229,.82) 39%, rgba(246,239,229,.14) 65%, rgba(246,239,229,.5) 100%),
    url('../assets/images/nasduck-bg.webp') center 42% / cover no-repeat;
  filter: saturate(.92);
}
.hero::before {
  content: ""; position: absolute; width: 920px; height: 920px; right: -130px; top: 120px; z-index: -3;
  border-radius: 50%; background: rgba(255,250,243,.38); border: 1px solid rgba(255,255,255,.7);
}
.hero-orbit { position: absolute; border-radius: 50%; border: 1px solid rgba(22,73,200,.18); z-index: -2; }
.hero-orbit-a { width: 680px; height: 680px; right: 40px; top: 210px; }
.hero-orbit-b { width: 830px; height: 830px; right: -35px; top: 135px; border-style: dashed; animation: spin 42s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

.topbar { height: 58px; display: flex; align-items: center; justify-content: space-between; position: relative; z-index: 20; }
.micro-brand { display: inline-flex; align-items: center; gap: 10px; font-size: 12px; letter-spacing: .16em; font-weight: 900; }
.brand-dot { width: 14px; height: 14px; border-radius: 50%; background: var(--lime-bright); border: 3px solid var(--blue); box-shadow: 0 0 0 3px rgba(182,226,51,.35); }
.topnav { display: flex; gap: 34px; font-size: 12px; letter-spacing: .11em; font-weight: 900; }
.topnav a { position: relative; }
.topnav a::after { content:""; position:absolute; left:0; bottom:-8px; width:100%; height:2px; background:var(--blue); transform:scaleX(0); transform-origin:right; transition:transform .28s ease; }
.topnav a:hover::after { transform:scaleX(1); transform-origin:left; }
.status-pill { border: 1px solid rgba(23,25,28,.16); border-radius: 999px; padding: 10px 14px; font-size: 11px; letter-spacing: .13em; font-weight: 900; text-transform: uppercase; background: rgba(255,250,243,.65); backdrop-filter: blur(10px); }
.status-pill i { display:inline-block; width:8px; height:8px; border-radius:50%; background:var(--lime); margin-right:8px; box-shadow:0 0 0 4px rgba(141,189,39,.15); }

.hero-grid { min-height: calc(100vh - 150px); display: grid; grid-template-columns: 52% 48%; align-items: center; position: relative; z-index: 5; }
.hero-copy { max-width: 820px; padding-top: 20px; }
.token-title { margin: 0 0 22px; font-size: clamp(92px, 8.15vw, 158px); line-height: .78; letter-spacing: -.085em; font-weight: 950; text-transform: lowercase; }
.token-title .part-a { color: var(--ink); }
.token-title .part-b { color: var(--blue); text-shadow: 4px 4px 0 rgba(182,226,51,.45); }
.hero-line { max-width: 620px; margin: 0 0 30px; font-size: 22px; line-height: 1.28; font-weight: 700; }
.hero-actions, .community-actions { display: flex; gap: 12px; flex-wrap: wrap; }
.btn {
  position: relative; display: inline-flex; align-items: center; justify-content: space-between; min-width: 176px; gap: 24px;
  padding: 16px 20px; border: 2px solid var(--ink); border-radius: 18px; font-size: 13px; letter-spacing: .08em; font-weight: 950;
  box-shadow: 4px 4px 0 var(--ink); transition: transform .16s ease, box-shadow .16s ease, filter .2s ease;
}
.btn:hover { transform: translate(-2px,-2px) rotate(-.4deg); box-shadow: 7px 7px 0 var(--ink); filter: saturate(1.08); }
.btn:active { transform: translate(3px,3px); box-shadow: 1px 1px 0 var(--ink); }
.btn-blue { background: var(--blue); color: #fff; }
.btn-green { background: var(--lime-bright); }
.btn-pink { background: #f1b8ad; }
.btn span { font-size: 20px; line-height: 1; }

.ca-card { margin-top: 28px; width: min(720px, 100%); border-top: 1px solid rgba(23,25,28,.24); padding-top: 14px; }
.ca-meta { display:flex; justify-content:space-between; margin-bottom: 8px; font-size: 10px; letter-spacing: .15em; font-weight: 900; }
.ca-meta strong { color: var(--blue); }
.ca-row { display: flex; align-items: center; gap: 10px; }
.ca-row code { flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; background: rgba(255,250,243,.72); border: 1px solid rgba(23,25,28,.18); border-radius: 14px; padding: 14px 16px; font-family: "Courier New", monospace; font-size: 12px; }
.copy-btn { cursor: pointer; border: 2px solid var(--ink); border-radius: 14px; padding: 13px 16px; background: var(--pink); font-size: 12px; font-weight: 950; letter-spacing: .1em; box-shadow: 3px 3px 0 var(--ink); transition: all .16s ease; }
.copy-btn:hover { background: var(--lime-bright); transform: translate(-1px,-1px); box-shadow: 5px 5px 0 var(--ink); }
.copy-btn:active { transform: translate(2px,2px); box-shadow: 1px 1px 0 var(--ink); }

.hero-visual { position: relative; height: 760px; display: grid; place-items: center; }
.photo-halo { position:absolute; width:610px; height:610px; border-radius:50%; background:radial-gradient(circle at 50% 40%, rgba(255,255,255,.9), rgba(182,226,51,.36) 52%, rgba(22,73,200,.12) 70%, transparent 71%); filter: blur(2px); }
.photo-frame { position:relative; width: 620px; height: 690px; border-radius: 49% 51% 46% 54% / 45% 45% 55% 55%; overflow:hidden; border: 6px solid var(--lime-bright); box-shadow: 0 0 0 9px var(--blue), 0 0 0 14px rgba(255,255,255,.7), var(--shadow); transform: rotate(1.2deg); will-change: transform; }
.photo-frame img { width:100%; height:100%; object-fit:cover; object-position:center 47%; transform:scale(1.02); }
.photo-frame::after { content:""; position:absolute; inset:0; box-shadow:inset 0 0 80px rgba(13,26,46,.15); pointer-events:none; }
.lens-sheen { position:absolute; top: 34%; width: 31%; height: 17%; border-radius:50%; background:linear-gradient(135deg, rgba(255,255,255,.44), rgba(255,255,255,0) 52%); filter: blur(.2px); pointer-events:none; mix-blend-mode:screen; }
.lens-sheen-left { left:16%; transform:rotate(-8deg); }
.lens-sheen-right { right:13%; transform:rotate(9deg); }
.float-tag { position:absolute; z-index:4; background:rgba(255,250,243,.9); backdrop-filter:blur(12px); border:1px solid rgba(23,25,28,.2); border-radius:999px; padding:10px 14px; font-size:10px; font-weight:950; letter-spacing:.12em; box-shadow:0 8px 25px rgba(23,25,28,.1); }
.float-tag span { color:var(--blue); margin-right:7px; }
.tag-hat { top:120px; left:0; transform:rotate(-4deg); }
.tag-goggles { top:310px; right:-20px; transform:rotate(3deg); }
.tag-vibe { bottom:90px; left:20px; transform:rotate(2deg); }
.duck-stamp { position:absolute; right:22px; bottom:18px; width:108px; height:108px; border-radius:50%; background:var(--orange); border:3px solid var(--ink); display:grid; place-items:center; text-align:center; font-size:16px; line-height:.95; font-weight:950; transform:rotate(-10deg); box-shadow:4px 4px 0 var(--ink); }
.scroll-note { position:absolute; left:4.2vw; bottom:22px; font-size:10px; letter-spacing:.15em; font-weight:900; opacity:.7; }
.scroll-note span { font-size:20px; margin-left:8px; }

.marquee { overflow:hidden; border-top:2px solid var(--ink); border-bottom:2px solid var(--ink); background:var(--lime-bright); transform:rotate(-.35deg) scale(1.01); position:relative; z-index:10; }
.marquee-track { display:flex; width:max-content; gap:22px; align-items:center; padding:13px 0; animation:marquee 26s linear infinite; font-size:14px; letter-spacing:.08em; font-weight:950; text-transform:uppercase; }
.marquee-track b { color:var(--blue); font-size:18px; }
.marquee-track.reverse { animation-direction:reverse; }
@keyframes marquee { to { transform:translateX(-50%); } }
.marquee-blue { background:var(--blue); color:#fff; border-color:#fff; }
.marquee-blue .marquee-track b { color:var(--lime-bright); }

.lore { background: var(--paper); min-height: 980px; padding-top: 70px; }
.lore-grid { display:grid; grid-template-columns:1.05fr .95fr; gap:8vw; align-items:end; max-width:1500px; margin:90px auto 80px; }
.lore h2, .hat-copy h2, .community h2, .goggle-head h2 { margin:0; font-size: clamp(62px,5.2vw,100px); line-height:.92; letter-spacing:-.055em; }
.lore-copy { padding-bottom:8px; }
.lore-copy p { font-family: Georgia, serif; font-size:23px; line-height:1.45; margin:0 0 24px; max-width:650px; }
.signature { font-size:12px; letter-spacing:.14em; font-weight:900; text-transform:uppercase; color:var(--blue); }
.lore-collage { max-width:1500px; margin:0 auto; display:grid; grid-template-columns:1.1fr 1fr .85fr; gap:18px; align-items:stretch; }
.detail-card { margin:0; position:relative; min-height:340px; border:2px solid var(--ink); border-radius:30px; overflow:hidden; background:#ddd; box-shadow:6px 6px 0 var(--ink); }
.detail-card img { width:100%; height:100%; object-fit:cover; transition:transform .45s cubic-bezier(.2,.7,.2,1); }
.detail-card:hover img { transform:scale(1.05); }
.detail-card figcaption { position:absolute; left:16px; bottom:16px; background:rgba(255,250,243,.92); border:1px solid var(--ink); border-radius:999px; padding:9px 12px; font-size:10px; letter-spacing:.1em; font-weight:950; text-transform:uppercase; }
.rules-card { border:2px solid var(--ink); border-radius:30px; padding:28px; background:var(--pink); box-shadow:6px 6px 0 var(--ink); display:flex; flex-direction:column; justify-content:space-between; }
.rules-card > span { font-size:12px; letter-spacing:.16em; font-weight:950; color:var(--blue-deep); }
.rules-card ol { margin:30px 0; padding-left:24px; font-size:20px; line-height:1.55; font-weight:800; }
.rules-card small { font-family:Georgia,serif; font-style:italic; }

.goggle-lab { min-height:1000px; background:var(--blue-deep); color:#fff; overflow:hidden; padding-top:70px; isolation:isolate; }
.goggle-bg { position:absolute; inset:0; z-index:-2; opacity:.13; background:url('../assets/images/goggles-detail.webp') center / cover no-repeat; filter:blur(20px) saturate(1.2); transform:scale(1.15); }
.goggle-lab::before { content:""; position:absolute; inset:0; z-index:-1; background:radial-gradient(circle at 50% 52%, rgba(141,189,39,.12), transparent 38%), linear-gradient(180deg, rgba(12,40,115,.28), rgba(6,17,51,.92)); }
.goggle-head { text-align:center; max-width:950px; margin:55px auto 32px; }
.goggle-head h2 { font-size:clamp(70px,6vw,116px); }
.goggle-head h2 em { color:var(--lime-bright); font-style:normal; text-shadow:5px 5px 0 rgba(0,0,0,.28); }
.goggle-head > p:last-child { font-family:Georgia,serif; font-size:21px; color:rgba(255,255,255,.72); }
.goggle-rig { position:relative; height:390px; max-width:1120px; margin: 20px auto 0; display:flex; align-items:center; justify-content:center; gap:36px; }
.lens { position:relative; width:355px; height:270px; border-radius:48%; background:rgba(185,255,45,.15); border:22px solid var(--lime); box-shadow:inset 0 0 40px rgba(182,226,51,.3), 0 0 0 8px rgba(255,255,255,.1), 0 24px 60px rgba(0,0,0,.32); overflow:hidden; }
.iris { position:absolute; left:50%; top:50%; width:150px; height:150px; border-radius:50%; background:radial-gradient(circle at 40% 35%, #53462f 0 8%, #16130e 20% 38%, #060706 39% 54%, #17120b 55% 100%); transform:translate(-50%,-50%); box-shadow:0 0 0 18px rgba(244,239,221,.72); transition:transform .08s linear; }
.pupil { position:absolute; left:50%; top:50%; width:55px; height:55px; border-radius:50%; background:#030303; transform:translate(-50%,-50%); box-shadow:0 0 22px rgba(0,0,0,.8); }
.glint { position:absolute; left:30%; top:25%; width:18px; height:18px; border-radius:50%; background:#fff; opacity:.7; }
.bridge { width:98px; height:86px; background:var(--blue); border:8px solid rgba(255,255,255,.1); border-radius:25px; display:grid; place-items:center; font-size:18px; font-weight:950; letter-spacing:.08em; box-shadow:0 12px 30px rgba(0,0,0,.25); }
.strap { position:absolute; top:50%; width:240px; height:38px; background:var(--blue); border:6px solid rgba(255,255,255,.1); transform:translateY(-50%); }
.strap-left { left:-80px; border-radius:20px 0 0 20px; }
.strap-right { right:-80px; border-radius:0 20px 20px 0; }
.inspection-btn { display:block; margin: 0 auto; cursor:pointer; border:2px solid #fff; color:#fff; background:transparent; border-radius:999px; padding:14px 22px; font-size:11px; letter-spacing:.14em; font-weight:950; transition:.2s ease; }
.inspection-btn:hover { color:var(--ink); background:var(--lime-bright); border-color:var(--lime-bright); transform:translateY(-2px); }
.inspection-result { text-align:center; margin-top:14px; font-family:Georgia,serif; font-style:italic; color:rgba(255,255,255,.66); min-height:22px; }

.hatology { min-height:900px; background:#f4d2ca; padding-top:70px; }
.hat-grid { max-width:1500px; margin:95px auto 0; display:grid; grid-template-columns:.9fr 1.1fr; gap:7vw; align-items:center; }
.hat-photo { position:relative; width:100%; height:610px; border-radius:90px 36px 90px 36px; overflow:hidden; border:3px solid var(--ink); box-shadow:10px 10px 0 var(--blue); transform:rotate(-2deg); }
.hat-photo img { width:100%; height:100%; object-fit:cover; transform:scale(1.18); }
.photo-note { position:absolute; left:22px; bottom:22px; background:var(--lime-bright); border:2px solid var(--ink); padding:11px 14px; border-radius:999px; font-size:10px; letter-spacing:.11em; font-weight:950; text-transform:uppercase; }
.hat-copy h2 { max-width:760px; }
.hat-copy > p:not(.eyebrow) { font-family:Georgia,serif; font-size:23px; line-height:1.5; max-width:700px; }
.fact-strip { display:flex; margin-top:40px; border-top:2px solid var(--ink); border-bottom:2px solid var(--ink); }
.fact-strip span { flex:1; padding:18px 10px; font-size:12px; letter-spacing:.08em; text-transform:uppercase; text-align:center; border-right:1px solid rgba(23,25,28,.35); }
.fact-strip span:last-child { border-right:0; }
.fact-strip b { display:block; font-size:28px; color:var(--blue); letter-spacing:-.05em; margin-bottom:2px; }

.community { min-height:1040px; background:var(--ink); color:#fff; overflow:hidden; padding-top:75px; isolation:isolate; }
.community-bg { position:absolute; inset:0; z-index:-3; background:linear-gradient(90deg, rgba(23,25,28,.98) 0%, rgba(23,25,28,.91) 48%, rgba(23,25,28,.38) 100%), url('../assets/images/nasduck-bg.webp') 72% 44% / cover no-repeat; filter:saturate(.82) contrast(1.02); }
.community::after { content:""; position:absolute; width:760px; height:760px; right:-120px; top:170px; border-radius:50%; border:1px dashed rgba(182,226,51,.38); z-index:-1; animation:spin 45s linear infinite reverse; }
.community-grid { max-width:1500px; margin:70px auto 50px; display:grid; grid-template-columns:1.05fr .95fr; gap:7vw; align-items:center; }
.community-copy h2 { font-size:clamp(66px,5.3vw,104px); max-width:840px; }
.community-copy > p:not(.eyebrow) { max-width:650px; font-family:Georgia,serif; font-size:22px; line-height:1.5; color:rgba(255,255,255,.72); }
.community-actions { margin-top:32px; }
.community-actions .btn { border-color:#fff; box-shadow:4px 4px 0 #fff; color:var(--ink); }
.community-actions .btn:hover { box-shadow:7px 7px 0 #fff; }
.community-duck { position:relative; height:600px; }
.community-image { width:540px; height:540px; border-radius:50%; overflow:hidden; border:8px solid var(--lime-bright); box-shadow:0 0 0 10px var(--blue), 0 0 0 14px rgba(255,255,255,.12), 0 35px 80px rgba(0,0,0,.45); margin:20px auto 0; }
.community-image img { width:100%; height:100%; object-fit:cover; transform:scale(1.05); }
.bubble { position:absolute; display:block; background:#fff; color:var(--ink); border:2px solid var(--ink); border-radius:999px; padding:10px 14px; font-size:11px; letter-spacing:.08em; font-weight:950; box-shadow:4px 4px 0 var(--lime); }
.b1 { top:70px; left:12px; transform:rotate(-8deg); }
.b2 { top:310px; right:-10px; transform:rotate(5deg); }
.b3 { bottom:36px; left:42px; transform:rotate(2deg); }
.final-ca { max-width:1500px; margin:30px auto 60px; padding:22px 0; border-top:1px solid rgba(255,255,255,.22); border-bottom:1px solid rgba(255,255,255,.22); display:flex; align-items:center; justify-content:space-between; gap:30px; }
.final-ca > div { min-width:0; }
.final-ca span { display:block; font-size:10px; letter-spacing:.14em; font-weight:950; color:#dff48c; margin-bottom:9px; }
.final-ca code { display:block; max-width:980px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; color:#fff; font-family:"Courier New",monospace; font-size:20px; }
.copy-btn-large { background:var(--pink); min-width:150px; }
footer { max-width:1500px; margin:0 auto; padding: 25px 0 0; display:flex; justify-content:space-between; align-items:end; }
.footer-name { font-size:38px; letter-spacing:-.05em; font-weight:950; }
.footer-name .part-b { color:var(--lime-bright); }
.footer-meta { text-align:right; font-size:10px; letter-spacing:.13em; font-weight:900; color:rgba(255,255,255,.58); }
.footer-meta span { display:block; margin-top:6px; }
.footer-meta span:first-child { color:#fff; font-size:17px; }

.toast { position:fixed; left:50%; bottom:32px; z-index:200; transform:translate(-50%,30px); opacity:0; pointer-events:none; background:var(--lime-bright); color:var(--ink); border:2px solid var(--ink); border-radius:999px; padding:12px 18px; box-shadow:4px 4px 0 var(--ink); font-size:12px; letter-spacing:.14em; font-weight:950; transition:.24s ease; }
.toast.show { opacity:1; transform:translate(-50%,0); }

.reveal { opacity:0; transform:translateY(34px); transition:opacity .75s ease, transform .75s cubic-bezier(.2,.7,.2,1); }
.reveal.in { opacity:1; transform:translateY(0); }

@media (max-width: 1480px) {
  .section-shell { padding-left:3vw; padding-right:3vw; }
  .photo-frame { width:540px; height:610px; }
  .photo-halo { width:540px; height:540px; }
  .hero-visual { height:680px; }
  .token-title { font-size:105px; }
  .hero-line { font-size:19px; }
  .lore-grid, .lore-collage, .hat-grid, .community-grid, .final-ca, footer { max-width:1320px; }
  .goggle-rig { transform:scale(.88); transform-origin:center; }
  .community-image { width:480px; height:480px; }
}

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