:root {
  --paper: #f3e4cf;
  --paper-2: #e9d5bb;
  --paper-3: #ddc3a4;
  --ink: #4d3427;
  --ink-soft: #7c5c49;
  --accent: #f0aa33;
  --accent-2: #ffcf7c;
  --shadow: rgba(95, 59, 26, 0.16);
  --line: rgba(109, 74, 42, 0.15);
  --radius-xl: 34px;
  --container: 1280px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  font-family: "Nunito", system-ui, sans-serif;
  background: radial-gradient(circle at top left, rgba(255,196,112,0.28), transparent 24%), radial-gradient(circle at bottom right, rgba(238,171,63,0.18), transparent 28%), linear-gradient(180deg, #f6ead8 0%, #f2e2cd 100%);
  min-height: 100vh;
  overflow-x: hidden;
}
.paper-noise {
  position: fixed; inset: 0; pointer-events: none; opacity: 0.08; mix-blend-mode: multiply; z-index: 0;
  background-image: radial-gradient(rgba(110,71,44,0.18) 0.6px, transparent 0.6px), radial-gradient(rgba(255,255,255,0.4) 0.8px, transparent 0.8px);
  background-size: 14px 14px, 18px 18px; background-position: 0 0, 7px 7px;
}
img { display: block; max-width: 100%; }
.container { width: min(var(--container), calc(100% - 42px)); margin: 0 auto; position: relative; z-index: 1; }
.section { padding: 72px 0; }
.topbar {
  position: sticky; top: 0; z-index: 50; backdrop-filter: blur(10px); background: rgba(247,236,219,0.82); border-bottom: 1px solid var(--line); box-shadow: 0 12px 28px rgba(126,85,41,0.08);
}
.topbar-inner { min-height: 78px; display:flex; align-items:center; justify-content:space-between; gap:22px; }
.ticker-badge, .topbar-link, .icon-button, .buy-button, .cta-button, .copy-button { text-decoration:none; transition: transform .18s ease, box-shadow .18s ease, background .18s ease; }
.ticker-badge {
  display:inline-flex; align-items:center; justify-content:center; flex:0 0 auto; min-height:46px; padding:0 18px; border-radius:16px; background:linear-gradient(180deg,#fffaf2,#efd6b5); border:1px solid rgba(149,102,44,0.20); box-shadow:0 8px 18px rgba(103,70,38,0.10), inset 0 -3px 0 rgba(189,142,83,0.14); color:var(--ink); font-family:"Baloo 2", cursive; font-size:1.18rem; line-height:1; font-weight:800; white-space:nowrap;
}
.topbar-actions { display:flex; align-items:center; gap:10px; flex-wrap:nowrap; justify-content:flex-end; margin-left:auto; }
.topbar-link, .icon-button, .buy-button, .cta-button, .copy-button { border-radius:999px; border:2px solid rgba(141,98,46,0.12); box-shadow:0 10px 20px rgba(98,62,25,0.10), inset 0 -4px 0 rgba(153,112,58,0.10); font-weight:800; }
.topbar-link { display:inline-flex; align-items:center; justify-content:center; gap:9px; min-height:46px; padding:0 16px; background:linear-gradient(180deg,#fffaf3,#f2dfc4); color:var(--ink); font-size:.96rem; line-height:1; white-space:nowrap; }
.icon-wrap { width:19px; height:19px; flex:0 0 19px; display:inline-flex; align-items:center; justify-content:center; }
.icon-wrap svg { width:100%; height:100%; }
.icon-button svg { width:20px; height:20px; flex:0 0 20px; display:block; }
.icon-button { display:inline-flex; align-items:center; justify-content:center; width:46px; height:46px; flex:0 0 46px; gap:0; padding:0; border-radius:16px; background:linear-gradient(180deg,#fffaf3,#f1ddc1); color:var(--ink); font-size:.95rem; }
.icon-button span { display:none; }
.buy-button, .cta-button.primary, .cta-button.accent { background:linear-gradient(180deg,#ffda92 0%, #f0ac3c 100%); color:#47280c; }
.buy-button { display:inline-flex; align-items:center; justify-content:center; min-height:46px; padding:0 20px; font-size:.96rem; line-height:1; white-space:nowrap; }
.menu-toggle { display:none; width:58px; height:58px; border:2px solid rgba(141,98,46,0.12); background:linear-gradient(180deg,#fff8ef,#f2dfc4); border-radius:18px; box-shadow:0 10px 20px rgba(98,62,25,0.10), inset 0 -4px 0 rgba(153,112,58,0.10); }
.menu-toggle span { display:block; width:24px; height:3px; margin:5px auto; background:var(--ink); border-radius:999px; }
.paper-card {
  position:relative; background:linear-gradient(180deg, rgba(255,255,255,0.55), rgba(255,255,255,0.16)), linear-gradient(180deg, var(--paper) 0%, var(--paper-2) 100%); border:1px solid rgba(121,84,49,0.13); border-radius:var(--radius-xl); box-shadow:0 20px 44px var(--shadow), inset 0 1px 0 rgba(255,255,255,0.62), inset 0 -6px 20px rgba(190,140,86,0.12); overflow:hidden;
}
.paper-card::before { content:""; position:absolute; inset:0; pointer-events:none; background:radial-gradient(circle at 15% 18%, rgba(255,255,255,0.42), transparent 30%), radial-gradient(circle at 80% 75%, rgba(255,206,129,0.18), transparent 28%); opacity:.75; }
.torn-edge::after { content:""; position:absolute; inset:auto 0 0 0; height:22px; background: radial-gradient(circle at 10px -2px, transparent 12px, rgba(0,0,0,0.09) 13px, transparent 14px) repeat-x; background-size:36px 20px; opacity:.22; }
.hero-grid, .split-grid { display:grid; grid-template-columns:1.08fr 0.92fr; gap:32px; align-items:center; }
.hero-copy { padding:38px; }
.eyebrow, .section-kicker { margin:0 0 10px; font-family:"Baloo 2", cursive; font-weight:800; text-transform:uppercase; letter-spacing:.06em; color:var(--ink-soft); font-size:1rem; }
.section-kicker.light { color:rgba(255,248,236,0.82); }
.site-logo { width:min(100%,580px); margin-bottom:18px; }
.tagline { margin:0; font-size:clamp(1.24rem,2.3vw,1.7rem); line-height:1.45; color:var(--ink); max-width:720px; }
.hero-cta-row { display:flex; flex-wrap:wrap; gap:14px; margin-top:28px; }
.cta-button { display:inline-flex; align-items:center; justify-content:center; min-height:58px; padding:14px 24px; font-size:1.08rem; font-weight:800; color:var(--ink); background:linear-gradient(180deg,#fff8ef,#f1ddc1); }
.cta-button.secondary { background:linear-gradient(180deg,#fffaf3,#ead4b4); }
.cta-button.light { background:rgba(255,255,255,0.14); border-color:rgba(255,255,255,0.18); box-shadow:0 10px 22px rgba(0,0,0,0.18), inset 0 -3px 0 rgba(255,255,255,0.08); color:#fff6e8; }
.contract-card { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:18px 20px; margin-top:24px; border-radius:26px; background:rgba(255,250,241,0.62); border:1px dashed rgba(127,86,44,0.25); }
.contract-label { display:block; margin-bottom:6px; font-size:.92rem; font-weight:700; color:var(--ink-soft); }
.contract-card code { display:inline-block; font-size:.97rem; line-height:1.45; word-break:break-all; color:var(--ink); }
.copy-button { min-width:122px; min-height:54px; padding:12px 18px; background:linear-gradient(180deg,#fff8ef,#ecd3ae); color:var(--ink); cursor:pointer; }
.copy-button.copied { background:linear-gradient(180deg,#fff1d4,#f7b94f); }
.micro-note { margin-top:18px; font-size:.98rem; color:var(--ink-soft); }
.hero-visual { display:flex; justify-content:center; }
.hero-frame { padding:14px; border-radius:42px; transform:rotate(1.5deg); box-shadow:0 28px 50px rgba(119,73,30,0.22); }
.hero-frame img, .visual-card img { width:100%; height:auto; border-radius:28px; }
.floating-card { animation: floaty 4.6s ease-in-out infinite; }
@keyframes floaty { 0%,100% { transform:translateY(0) rotate(1.5deg);} 50% { transform:translateY(-10px) rotate(0.2deg);} }
.section-heading.centered { text-align:center; max-width:860px; margin:0 auto 24px; }
.section h2 { margin:0 0 14px; font-family:"Baloo 2", cursive; font-size:clamp(2.2rem,4vw,3.2rem); line-height:1; color:var(--ink); }
.section p { font-size:1.14rem; line-height:1.7; }
.content-card, .visual-card { padding:28px; }
.tilt-left { transform:rotate(-1.2deg); }
.tilt-right { transform:rotate(1.1deg); }
.roadmap-list { display:grid; gap:16px; }
.roadmap-item { padding:18px 20px; border-radius:22px; background:rgba(255,249,240,0.55); border:1px solid rgba(121,84,49,0.12); }
.phase { display:inline-flex; margin-bottom:8px; padding:8px 14px; border-radius:999px; background:linear-gradient(180deg,#fff1d1,#edc277); font-family:"Baloo 2", cursive; font-weight:800; color:#6a431c; }
.roadmap-item h3 { margin:0 0 6px; font-size:1.44rem; }
.roadmap-item p, .tokenomics-note { margin:0; }
.tokenomics-grid { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:16px; margin-bottom:20px; }
.token-card { padding:18px 18px 16px; border-radius:22px; background:rgba(255,248,238,0.58); border:1px solid rgba(121,84,49,0.12); }
.token-card span { display:block; margin-bottom:10px; font-size:.98rem; color:var(--ink-soft); font-weight:700; }
.token-card strong { display:block; font-family:"Baloo 2", cursive; font-size:1.6rem; line-height:1.1; }
.chart-shell { padding:18px; }
.chart-shell iframe { display:block; width:100%; height:660px; border:0; border-radius:22px; background:#13110f; }
.join-us { position:relative; background:url("assets/bg.png") center/cover no-repeat; overflow:hidden; }
.join-overlay { position:absolute; inset:0; background:linear-gradient(180deg, rgba(50,31,18,0.58), rgba(39,23,11,0.74)); }
.join-inner { position:relative; z-index:1; padding:42px; text-align:center; }
.dark-card { background:rgba(64,40,25,0.42); color:#fff8ec; border-color:rgba(255,225,186,0.16); box-shadow:0 22px 44px rgba(0,0,0,0.22), inset 0 1px 0 rgba(255,255,255,0.10); }
.dark-card h2, .dark-card p { color:#fff8ec; }
.join-buttons { display:flex; justify-content:center; gap:16px; flex-wrap:wrap; margin-top:24px; }
.footer { padding:28px 0 52px; }
.footer-inner { display:flex; align-items:center; justify-content:space-between; gap:14px 20px; flex-wrap:wrap; padding:0 8px; color:var(--ink-soft); }
.footer-inner p { margin:0; font-size:.98rem; line-height:1.6; }
.ticker-badge:hover, .topbar-link:hover, .icon-button:hover, .buy-button:hover, .cta-button:hover, .copy-button:hover { transform:translateY(-2px); box-shadow:0 16px 30px rgba(98,62,25,0.16), inset 0 -4px 0 rgba(153,112,58,0.10); }
@media (max-width:1120px) { .hero-grid, .split-grid { grid-template-columns:1fr; } .reverse-mobile > :first-child { order:2; } .reverse-mobile > :last-child { order:1; } .hero-visual { order:-1; } }
@media (max-width:900px) {
  .topbar-inner { min-height:74px; }
  .menu-toggle { display:block; }
  .topbar-actions { position:absolute; top:calc(100% + 10px); right:0; width:min(100%, 360px); flex-direction:column; align-items:stretch; background:rgba(247,236,219,0.98); padding:14px; border-radius:24px; border:1px solid var(--line); box-shadow:0 20px 36px rgba(97,63,31,0.16); opacity:0; pointer-events:none; transform:translateY(-8px); transition:opacity .2s ease, transform .2s ease; }
  .topbar-actions.open { opacity:1; pointer-events:auto; transform:translateY(0); }
  .topbar-link, .icon-button, .buy-button { justify-content:center; width:100%; min-height:48px; }
  .icon-button { height:48px; flex-basis:auto; gap:9px; }
  .icon-button span { display:inline; }
  .hero-copy, .content-card, .visual-card, .join-inner { padding:24px; }
  .contract-card { flex-direction:column; align-items:stretch; }
  .copy-button { width:100%; }
  .chart-shell iframe { height:560px; }
}
@media (max-width:620px) {
  .container { width:min(var(--container), calc(100% - 24px)); }
  .section { padding:52px 0; }
  .ticker-badge { min-height:44px; padding:0 15px; font-size:1.08rem; }
  .hero-copy { padding:20px; }
  .hero-frame { border-radius:28px; padding:10px; }
  .hero-frame img, .visual-card img { border-radius:18px; }
  .section p { font-size:1rem; }
  .tokenomics-grid { grid-template-columns:1fr; }
  .chart-shell iframe { height:480px; }
}
