:root {
  --bg: #f8f1e8;
  --bg-2: #fffaf4;
  --panel: rgba(255, 252, 247, 0.88);
  --panel-strong: #fffdf9;
  --ink: #33291f;
  --muted: #86786d;
  --line: rgba(101, 78, 58, 0.12);
  --brown: #9f6f4c;
  --brown-dark: #744b32;
  --sand: #ead5bd;
  --peach: #f1c7ae;
  --gold: #f0ad55;
  --cream: #fff5e7;
  --shadow: 0 28px 80px rgba(109, 79, 52, 0.13);
  --radius-xl: 34px;
  --radius-lg: 26px;
  --radius-md: 18px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  min-height: 100vh;
  color: var(--ink);
  background:
    radial-gradient(circle at 12% 10%, rgba(255, 225, 193, 0.52), transparent 24rem),
    radial-gradient(circle at 92% 18%, rgba(239, 198, 188, 0.34), transparent 26rem),
    linear-gradient(180deg, #fbf4ec 0%, #fffaf5 30%, #f8efe5 100%);
  font-family: ui-rounded, "SF Pro Rounded", "Nunito Sans", "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

button, a { font: inherit; }
button { color: inherit; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }

.page-glow { position: fixed; width: 460px; height: 460px; border-radius: 50%; filter: blur(90px); pointer-events: none; z-index: -1; opacity: .45; }
.glow-one { background: #f8d1b5; left: -180px; top: 30vh; }
.glow-two { background: #f3dfb0; right: -200px; top: 58vh; }

.site-header {
  width: min(1320px, calc(100% - 34px));
  min-height: 72px;
  margin: 18px auto 0;
  padding: 10px 12px 10px 16px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  position: sticky;
  top: 12px;
  z-index: 50;
  border: 1px solid rgba(255,255,255,.92);
  background: rgba(255, 253, 250, .78);
  backdrop-filter: blur(20px) saturate(1.2);
  border-radius: 999px;
  box-shadow: 0 18px 46px rgba(92, 67, 48, .09);
}

.brand { display: inline-flex; align-items: center; gap: 11px; width: max-content; font-weight: 900; letter-spacing: -0.035em; }
.brand-avatar { width: 44px; height: 44px; border-radius: 50%; overflow: hidden; padding: 3px; background: linear-gradient(145deg, #fff, #e9d0b8); box-shadow: inset 0 0 0 1px rgba(93,68,45,.08), 0 7px 16px rgba(98,69,45,.1); }
.brand-avatar img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; }
.brand-word { font-size: 19px; }

.desktop-nav { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 5px; }
.desktop-nav a { color: #76695e; font-size: 14px; font-weight: 700; padding: 11px 16px; border-radius: 999px; transition: .2s ease; }
.desktop-nav a:hover { color: var(--ink); background: rgba(147, 104, 74, .07); }

.header-actions { display: flex; justify-content: flex-end; align-items: center; gap: 8px; }
.icon-button, .wallet-button, .mobile-menu-button { border: 0; cursor: pointer; }
.icon-button { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 50%; background: #fffaf5; box-shadow: inset 0 0 0 1px var(--line); }
.icon-button svg { width: 17px; height: 17px; fill: #55483d; }
.wallet-button { min-height: 46px; padding: 0 19px; border-radius: 999px; background: linear-gradient(135deg, #a87654, #8c5f42); color: white; display: inline-flex; align-items: center; gap: 9px; font-weight: 800; font-size: 14px; box-shadow: 0 10px 24px rgba(122, 78, 47, .2); transition: transform .2s ease, box-shadow .2s ease; }
.wallet-button:hover { transform: translateY(-1px); box-shadow: 0 14px 28px rgba(122, 78, 47, .25); }
.wallet-dot { width: 7px; height: 7px; border-radius: 50%; background: #f6d6a5; box-shadow: 0 0 0 4px rgba(246,214,165,.14); }
.wallet-button.connected .wallet-dot { background: #b9e6bf; }
.mobile-menu-button { display: none; width: 44px; height: 44px; border-radius: 50%; background: #fffaf5; box-shadow: inset 0 0 0 1px var(--line); align-items: center; justify-content: center; flex-direction: column; gap: 4px; }
.mobile-menu-button span { width: 17px; height: 2px; background: #594b40; border-radius: 10px; }
.mobile-menu { display: none; }

.section-shell { width: min(1240px, calc(100% - 42px)); margin-inline: auto; }
.hero { min-height: 800px; padding: 92px 0 72px; display: grid; grid-template-columns: minmax(0, 1.03fr) minmax(0, .97fr); align-items: center; gap: 60px; }
.hero-copy { order: 1; }
.hero-visual { order: 2; position: relative; min-height: 610px; display: grid; place-items: center; }

.eyebrow { display: inline-flex; align-items: center; gap: 8px; font-size: 11px; letter-spacing: .18em; font-weight: 900; color: #a06446; text-transform: uppercase; }
.pulse-dot { width: 8px; height: 8px; border-radius: 50%; background: #e98c73; position: relative; }
.pulse-dot::after { content: ""; position: absolute; inset: -5px; border: 1px solid rgba(233,140,115,.32); border-radius: inherit; animation: pulse 2s ease-out infinite; }
@keyframes pulse { 0%{transform:scale(.8);opacity:0} 30%{opacity:1} 100%{transform:scale(1.8);opacity:0} }

.hero h1, .section-heading h2, .split-copy h2, .record-copy h2, .final-cta h2 { margin: 18px 0 0; letter-spacing: -0.055em; line-height: .98; }
.hero h1 { max-width: 690px; font-size: clamp(58px, 6vw, 88px); font-weight: 930; }
.hero h1 span { color: #a87250; }
.hero-description { max-width: 630px; margin: 26px 0 0; font-size: 19px; line-height: 1.65; color: #76685d; }
.hero-ctas { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 34px; }
.primary-button, .secondary-button { min-height: 52px; border-radius: 999px; padding: 0 22px; display: inline-flex; align-items: center; justify-content: center; gap: 13px; font-weight: 850; font-size: 14px; cursor: pointer; transition: .2s ease; }
.primary-button { border: 0; background: linear-gradient(135deg, #a87654, #8d5e40); color: white; box-shadow: 0 12px 24px rgba(128, 82, 51, .2); }
.primary-button:hover { transform: translateY(-2px); box-shadow: 0 16px 30px rgba(128,82,51,.25); }
.primary-button span { font-size: 18px; }
.secondary-button { border: 1px solid var(--line); background: rgba(255,255,255,.57); color: #584a3f; }
.secondary-button:hover { background: white; transform: translateY(-2px); }
.hero-notes { display: flex; flex-wrap: wrap; gap: 20px; margin-top: 27px; color: #8a7c70; font-size: 12px; font-weight: 750; }
.hero-notes span { display: inline-flex; align-items: center; gap: 7px; }
.hero-notes i { width: 20px; height: 20px; border-radius: 50%; background: #f2e3d4; color: #9e704e; display: grid; place-items: center; font-style: normal; font-size: 11px; }

.mascot-stage { width: min(500px, 78vw); aspect-ratio: 1; position: relative; display: grid; place-items: center; z-index: 3; }
.mascot-stage::before { content:""; position:absolute; width: 78%; height: 78%; border-radius: 50%; background: linear-gradient(145deg, rgba(255,255,255,.96), rgba(236,213,189,.74)); box-shadow: 0 34px 75px rgba(125, 91, 58, .18), inset 0 0 0 12px rgba(255,255,255,.75), inset 0 0 0 14px rgba(153,110,77,.15); }
.mascot-halo { position: absolute; width: 94%; height: 94%; border-radius: 50%; border: 1px dashed rgba(157,113,77,.2); animation: spin 34s linear infinite; }
.mascot { width: 72%; position: relative; z-index: 2; filter: drop-shadow(0 22px 24px rgba(86,58,36,.13)); animation: float 5.2s ease-in-out infinite; }
@keyframes float { 0%,100%{transform:translateY(0) rotate(-1deg)} 50%{transform:translateY(-10px) rotate(1deg)} }
@keyframes spin { to { transform: rotate(360deg); } }
.orbit { position:absolute; border-radius:50%; border:1px dashed rgba(145,101,68,.18); z-index:0; }
.orbit-outer { width: 94%; aspect-ratio:1; }
.orbit-inner { width: 72%; aspect-ratio:1; border-style:solid; border-color:rgba(145,101,68,.09); }
.orbital-card { position:absolute; z-index:6; padding: 9px 13px 9px 9px; border-radius:999px; background:rgba(255,253,249,.93); border:1px solid rgba(145,101,68,.1); box-shadow:0 10px 24px rgba(84,59,40,.1); display:flex; align-items:center; gap:8px; font-size:11px; font-weight:850; color:#6f5e50; backdrop-filter:blur(12px); }
.orbital-icon { width:28px; height:28px; border-radius:50%; display:grid; place-items:center; background:#f1dfcf; color:#9d704d; font-size:13px; }
.orbital-one { left: 0; top: 24%; animation: floatSmall 4.6s ease-in-out infinite; }
.orbital-two { right: 2%; top: 16%; animation: floatSmall 5.4s .3s ease-in-out infinite; }
.orbital-three { right: -2%; bottom: 20%; animation: floatSmall 4.8s .5s ease-in-out infinite; }
.orbital-four { left: 2%; bottom: 18%; animation: floatSmall 5.1s .8s ease-in-out infinite; }
@keyframes floatSmall { 50% { transform: translateY(-8px); } }
.quest-chip { position:absolute; z-index:8; min-width:105px; padding:11px 14px; border-radius:16px; background:rgba(255,253,249,.92); border:1px solid rgba(145,101,68,.1); box-shadow:0 13px 30px rgba(84,59,40,.11); backdrop-filter:blur(12px); }
.quest-chip span { display:block; color:#a59688; font-size:9px; letter-spacing:.15em; font-weight:900; }
.quest-chip strong { display:block; margin-top:3px; font-size:15px; }
.chip-left { left:11%; bottom:9%; transform:rotate(-3deg); }
.chip-right { right:8%; top:8%; transform:rotate(4deg); }

.soft-strip { width: min(1320px, calc(100% - 34px)); margin: 0 auto 20px; min-height: 74px; padding: 14px 24px; display:flex; align-items:center; justify-content:center; gap:22px; flex-wrap:wrap; border-radius:24px; border:1px solid rgba(255,255,255,.85); background:rgba(255,250,244,.62); box-shadow:0 12px 36px rgba(102,75,52,.06); color:#6d5f54; font-size:12px; font-weight:800; }
.soft-strip div:not(.strip-star) { display:flex; gap:8px; align-items:center; }
.soft-strip div span { width:28px; height:28px; border-radius:50%; background:#ecd8c3; color:#986c4d; display:grid; place-items:center; font-size:9px; }
.strip-star { color:#d4ad83; }

.content-section { padding: 110px 0 30px; }
.section-heading { display:grid; grid-template-columns:minmax(0,1fr) minmax(300px,.55fr); gap:40px; align-items:end; margin-bottom:36px; }
.section-heading h2, .split-copy h2, .record-copy h2, .final-cta h2 { font-size: clamp(42px, 4.7vw, 66px); }
.section-heading h2 { max-width:760px; }
.section-heading p { margin:0 0 2px; color:#806f62; line-height:1.7; font-size:15px; }

.quest-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.quest-card { position:relative; padding:18px; border-radius:28px; border:1px solid rgba(120,87,60,.1); background:rgba(255,253,249,.74); box-shadow:0 22px 54px rgba(90,63,43,.075); overflow:hidden; transition:transform .25s ease, box-shadow .25s ease; }
.quest-card:hover { transform:translateY(-5px); box-shadow:0 30px 60px rgba(90,63,43,.11); }
.quest-card.featured { border-color:rgba(174,118,77,.24); }
.featured-ribbon { position:absolute; top:0; left:50%; transform:translateX(-50%); z-index:4; padding:6px 12px; border-radius:0 0 12px 12px; color:#fff; background:#a97552; font-size:8px; font-weight:900; letter-spacing:.14em; }
.quest-card-top { display:flex; align-items:center; justify-content:space-between; padding:4px 2px 14px; }
.quest-type, .quest-xp { font-size:10px; font-weight:900; letter-spacing:.06em; text-transform:uppercase; }
.quest-type { color:#9b6a4a; }
.quest-xp { color:#8c7d70; }
.quest-art { height:220px; border-radius:22px; position:relative; overflow:hidden; display:grid; place-items:center; }
.art-research { background:radial-gradient(circle at 58% 42%, #fff 0 17%, transparent 18%), linear-gradient(145deg,#f2ddc9,#fff7ed); }
.magnifier { width:78px; height:78px; border:10px solid #9f7456; border-radius:50%; position:relative; box-shadow:inset 0 0 0 7px #fff4e8,0 12px 22px rgba(96,64,41,.12); }
.magnifier::after { content:""; position:absolute; width:56px; height:14px; background:#9f7456; border-radius:20px; right:-46px; bottom:-22px; transform:rotate(45deg); }
.mini-cloud { position:absolute; width:90px; height:36px; border-radius:50px; background:rgba(255,255,255,.72); }
.cloud-a { left:18px; top:35px; }
.cloud-b { right:15px; bottom:34px; width:72px; }
.art-star { position:absolute; color:#dda363; }
.s1 { top:33px; right:45px; font-size:25px; }.s2 { bottom:30px; left:48px; font-size:17px; }
.art-browse { background:linear-gradient(145deg,#f8e9dc,#efd2bf); }
.tiny-window { width:74%; height:70%; border-radius:16px; background:#fffaf6; box-shadow:0 18px 35px rgba(110,76,51,.16); position:relative; padding:15px; }
.tiny-window > span { display:inline-block; width:7px; height:7px; border-radius:50%; background:#e3c8b4; margin-right:3px; }
.window-line { height:8px; border-radius:20px; background:#efdfd2; margin-top:14px; }.window-line.l1{width:58%}.window-line.l2{width:75%;margin-top:8px}.window-card{height:55px;background:#f6ecdf;border-radius:11px;margin-top:13px}
.cursor-mark { position:absolute; width:48px; height:48px; display:grid; place-items:center; border-radius:50%; background:#9e704f; color:white; right:45px; bottom:30px; border:6px solid #f4dfcf; font-size:19px; box-shadow:0 10px 20px rgba(95,62,39,.16); }
.art-build { background:linear-gradient(145deg,#fff2e5,#e9d0ba); }
.code-card { width:72%; height:64%; border-radius:18px; background:#4d4037; color:white; padding:24px; box-shadow:0 18px 32px rgba(75,51,34,.18); }
.code-card b{font-size:27px;color:#f3c99f}.code-card span{display:block;height:7px;border-radius:20px;background:#76665b;margin-top:12px}.code-card span:nth-child(2){width:70%}.code-card span:nth-child(3){width:52%}.code-card span:nth-child(4){width:80%}
.build-check { position:absolute; width:52px;height:52px;display:grid;place-items:center;border-radius:50%;background:#f8e3c8;color:#976c4b;font-weight:900;right:42px;bottom:26px;border:5px solid #fff8ef;box-shadow:0 10px 22px rgba(92,62,40,.13); }
.quest-card h3 { margin:20px 2px 8px; font-size:24px; letter-spacing:-.035em; }
.quest-card p { margin:0 2px; min-height:70px; color:#7c6e62; font-size:13px; line-height:1.65; }
.quest-meta { display:flex; gap:7px; flex-wrap:wrap; margin:18px 0; }
.quest-meta span { padding:7px 10px; border-radius:999px; background:#f4e8dc; color:#8d725e; font-size:9px; font-weight:850; }
.card-action { width:100%; min-height:46px; border:1px solid rgba(115,82,58,.1); background:#fffaf5; border-radius:14px; cursor:pointer; display:flex; align-items:center; justify-content:space-between; padding:0 14px; font-weight:850; font-size:12px; transition:.2s ease; }
.card-action:hover { background:#9e704f; color:white; }
.card-action span{font-size:16px}

.split-panel { display:grid; grid-template-columns:1fr .95fr; gap:26px; align-items:stretch; background:rgba(255,252,247,.66); border:1px solid rgba(255,255,255,.9); border-radius:36px; padding:26px; box-shadow:var(--shadow); }
.split-copy { padding:42px 34px; }
.split-copy > p, .record-copy > p { margin:23px 0 0; color:#7c6c60; line-height:1.7; max-width:640px; }
.steps-list { margin-top:38px; display:grid; gap:5px; }
.step-row { display:grid; grid-template-columns:46px 1fr; gap:14px; padding:16px 0; border-top:1px solid var(--line); }
.step-number { width:36px;height:36px;border-radius:12px;background:#f2dfcd;display:grid;place-items:center;color:#996c4e;font-size:10px;font-weight:900; }
.step-row h3 { margin:1px 0 4px; font-size:16px; }.step-row p{margin:0;color:#8a7a6e;font-size:12px;line-height:1.6}

.journey-card { min-height:610px; border-radius:28px; background:linear-gradient(155deg,#f2dfcd,#fff9f2 58%,#eed2b8); padding:20px; position:relative; overflow:hidden; }
.journey-card::before { content:""; position:absolute; width:380px;height:380px;border-radius:50%;background:rgba(255,255,255,.35);right:-100px;top:-120px; }
.journey-top { position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;color:#8d6f59;font-size:9px;font-weight:900;letter-spacing:.12em; }
.live-pill { padding:7px 10px;border-radius:999px;background:rgba(255,255,255,.6);display:flex;align-items:center;gap:6px; }.live-pill i{width:6px;height:6px;border-radius:50%;background:#c68a68}
.journey-map { position:relative; height:455px; margin-top:15px; }
.path-line { position:absolute;left:20%;right:20%;top:53%;height:2px;border-top:2px dashed rgba(126,88,61,.24);transform:rotate(-10deg); }
.path-node { position:absolute;width:66px;text-align:center;z-index:3; }.path-node span{width:48px;height:48px;margin:auto;border-radius:50%;background:#fff8f0;border:1px solid rgba(139,93,61,.14);display:grid;place-items:center;color:#a16e4c;font-weight:900;box-shadow:0 10px 18px rgba(96,66,44,.1)}.path-node small{display:block;margin-top:7px;color:#947762;font-size:9px;font-weight:900;text-transform:uppercase;letter-spacing:.08em}.path-node.active span{background:#a26f4e;color:white}.node-1{left:5%;bottom:28%}.node-2{left:34%;bottom:36%}.node-3{right:28%;top:30%}.node-4{right:4%;top:19%}.trophy-node span{background:#f4c67e;color:#7d5538}
.journey-mascot { position:absolute;width:220px;left:50%;top:44%;transform:translate(-50%,-50%);filter:drop-shadow(0 18px 22px rgba(83,57,38,.13)); }
.journey-bottom { position:absolute;z-index:4;left:20px;right:20px;bottom:20px;padding:15px 16px;border-radius:18px;background:rgba(255,252,248,.75);backdrop-filter:blur(14px);display:flex;align-items:center;justify-content:space-between;border:1px solid rgba(255,255,255,.8); }.journey-bottom div span{display:block;color:#9a8878;font-size:9px;text-transform:uppercase;letter-spacing:.1em;font-weight:900}.journey-bottom div strong{display:block;margin-top:4px;font-size:14px}.journey-bottom button{border:0;background:#9f704f;color:white;border-radius:999px;padding:10px 13px;cursor:pointer;font-size:10px;font-weight:850}

.record-wrap { display:grid;grid-template-columns:.92fr 1.08fr;gap:70px;align-items:center; }
.record-copy { padding:40px 0; }
.record-points { display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:28px 0 32px; }.record-points span{display:flex;gap:9px;align-items:center;color:#6f6156;font-size:12px;font-weight:750}.record-points i{width:26px;height:26px;border-radius:9px;background:#f2e0ce;color:#a36f4d;display:grid;place-items:center;font-style:normal;font-size:11px}
.profile-card { border-radius:30px;background:rgba(255,253,249,.84);border:1px solid rgba(113,80,56,.1);box-shadow:var(--shadow);overflow:hidden; }
.profile-cover { height:145px;background:radial-gradient(circle at 70% 30%,rgba(255,255,255,.6),transparent 20%),linear-gradient(145deg,#e9cdb6,#f9eade);position:relative;overflow:hidden; }.profile-cover::before,.profile-cover::after{content:"";position:absolute;border-radius:50%;border:1px dashed rgba(145,94,59,.2)}.profile-cover::before{width:210px;height:210px;right:-30px;top:-80px}.profile-cover::after{width:140px;height:140px;left:70px;top:35px}.cover-star{position:absolute;color:#cc9364}.c1{left:35px;top:28px}.c2{right:40px;top:65px;font-size:26px}.c3{left:46%;top:28px;font-size:13px}
.profile-main { display:flex;align-items:center;gap:14px;padding:0 24px;position:relative;margin-top:-38px; }.profile-avatar{width:82px;height:82px;border-radius:24px;object-fit:cover;border:6px solid #fffaf5;box-shadow:0 10px 22px rgba(91,63,42,.12)}.profile-title{align-self:flex-end;padding-bottom:8px}.profile-title strong{display:block;font-size:18px}.profile-title span{display:block;color:#9a897a;font-size:10px;margin-top:3px}.level-pill{margin-left:auto;align-self:flex-end;margin-bottom:12px;padding:7px 10px;border-radius:999px;background:#f3e2d2;color:#966c4e;font-size:9px;font-weight:900;letter-spacing:.08em}
.xp-box { margin:24px;padding:15px;border-radius:16px;background:#fbf1e7; }.xp-line{display:flex;justify-content:space-between;color:#8d7b6d;font-size:9px;font-weight:850;text-transform:uppercase;letter-spacing:.06em}.xp-track{height:8px;border-radius:999px;background:#ead9ca;margin-top:10px;overflow:hidden}.xp-track span{display:block;width:4%;height:100%;background:#aa7752;border-radius:inherit}
.badge-row { display:grid;grid-template-columns:repeat(4,1fr);gap:9px;padding:0 24px 24px; }.badge-row div{padding:18px 8px;border-radius:16px;background:#fff9f2;border:1px solid rgba(119,83,57,.08);text-align:center}.badge-row span{height:35px;display:grid;place-items:center;color:#9e704f;font-size:17px;font-weight:900}.badge-row small{display:block;color:#918174;font-size:9px;font-weight:750;margin-top:5px}
.profile-footer { display:flex;align-items:center;justify-content:space-between;padding:16px 24px;border-top:1px solid var(--line);gap:20px; }.profile-footer span{color:#97877b;font-size:10px}.profile-footer button{border:0;background:none;color:#8c5e42;font-size:10px;font-weight:900;cursor:pointer}

.faq-heading { grid-template-columns:1fr; margin-bottom:24px; }
.faq-grid { display:grid;grid-template-columns:1fr 1fr;gap:12px; }.faq-grid details{border:1px solid rgba(109,76,53,.1);background:rgba(255,253,249,.7);border-radius:19px;padding:0 18px;box-shadow:0 12px 34px rgba(94,66,44,.05)}.faq-grid summary{list-style:none;cursor:pointer;padding:18px 30px 18px 0;font-weight:850;font-size:13px;position:relative}.faq-grid summary::-webkit-details-marker{display:none}.faq-grid summary::after{content:"+";position:absolute;right:2px;top:15px;width:26px;height:26px;border-radius:50%;background:#f2e4d6;display:grid;place-items:center;color:#9b6c4b;font-size:17px}.faq-grid details[open] summary::after{content:"−"}.faq-grid p{margin:0 0 18px;color:#827266;font-size:12px;line-height:1.7;padding-right:30px}

.final-cta { margin-top:110px;margin-bottom:50px;min-height:390px;border-radius:38px;background:linear-gradient(135deg,#e8c9ad 0%,#fff2e2 48%,#ecc9ae 100%);padding:52px 70px;display:grid;grid-template-columns:300px 1fr;gap:55px;align-items:center;position:relative;overflow:hidden;box-shadow:var(--shadow); }.final-cta::before{content:"";position:absolute;width:500px;height:500px;border-radius:50%;border:1px dashed rgba(130,87,55,.18);left:-130px;bottom:-300px}.final-cta img{width:290px;position:relative;z-index:2;filter:drop-shadow(0 18px 24px rgba(84,55,35,.13))}.final-cta h2{font-size:clamp(44px,5vw,70px)}.final-cta p{max-width:590px;color:#755f50;line-height:1.65;margin:18px 0 26px}.cta-stars span{position:absolute;color:#cf9565}.cta-stars span:nth-child(1){left:33px;top:34px;font-size:28px}.cta-stars span:nth-child(2){right:55px;top:52px;font-size:18px}.cta-stars span:nth-child(3){right:28%;bottom:36px;font-size:24px}

.site-footer { width:min(1240px,calc(100% - 42px));margin:0 auto;padding:35px 0 44px;border-top:1px solid var(--line);display:grid;grid-template-columns:1fr auto;gap:25px;align-items:center; }.footer-brand{display:flex;align-items:center;gap:11px}.footer-brand .brand-avatar{width:40px;height:40px}.footer-brand strong{display:block;font-size:14px}.footer-brand span{display:block;color:#98877a;font-size:10px;margin-top:2px}.footer-links{display:flex;align-items:center;gap:16px}.footer-links a,.footer-links button{border:0;background:none;padding:4px;color:#7c6d61;font-size:10px;font-weight:800;cursor:pointer}.footer-note{grid-column:1/-1;margin:0;color:#a39487;font-size:9px}

.modal-backdrop { position:fixed;inset:0;z-index:100;background:rgba(55,42,31,.26);backdrop-filter:blur(9px);display:flex;align-items:center;justify-content:center;padding:20px;opacity:0;visibility:hidden;transition:.2s ease; }.modal-backdrop.open{opacity:1;visibility:visible}.modal-card{width:min(430px,100%);border-radius:28px;background:#fffaf4;border:1px solid rgba(255,255,255,.9);box-shadow:0 34px 90px rgba(58,41,28,.2);padding:32px;text-align:center;position:relative;transform:translateY(10px) scale(.98);transition:.2s ease}.modal-backdrop.open .modal-card{transform:none}.modal-close{position:absolute;right:14px;top:14px;width:34px;height:34px;border-radius:50%;border:1px solid var(--line);background:#fff;cursor:pointer;color:#79695d;font-size:20px;line-height:1}.modal-mascot-wrap{width:90px;height:90px;margin:0 auto 13px;border-radius:27px;background:#f2dfcc;padding:4px;overflow:hidden}.modal-mascot-wrap img{width:100%;height:100%;object-fit:cover;border-radius:24px}.modal-kicker{color:#a27151;font-size:9px;font-weight:900;letter-spacing:.18em}.modal-card h2{margin:10px 0 9px;font-size:27px;letter-spacing:-.04em}.modal-card p{margin:0 auto;color:#806f62;font-size:12px;line-height:1.7;max-width:330px}.modal-primary{width:100%;margin-top:23px}.wallet-symbol{width:62px;height:62px;border-radius:20px;background:#f1dfcf;color:#986a4a;display:grid;place-items:center;margin:0 auto 13px;font-size:31px}.wallet-option{width:100%;margin-top:23px;padding:13px;border:1px solid var(--line);background:#fffdf9;border-radius:16px;display:grid;grid-template-columns:42px 1fr auto;align-items:center;gap:11px;text-align:left;cursor:pointer}.wallet-option:hover{border-color:rgba(155,106,72,.3);background:#fff8f0}.wallet-option-icon{width:38px;height:38px;border-radius:12px;background:#f1e1d1;color:#9c6b4b;display:grid;place-items:center}.wallet-option strong{display:block;font-size:12px}.wallet-option small{display:block;color:#978578;font-size:9px;line-height:1.4;margin-top:3px}.wallet-option b{color:#a16f4e}.network-note{display:flex;align-items:center;gap:10px;margin-top:12px;padding:12px;border-radius:15px;background:#f6ecdf;text-align:left}.network-icon{width:35px;height:35px;border-radius:50%;background:#1f2621;color:#c5ff75;display:grid;place-items:center;font-weight:900}.network-note strong{display:block;font-size:11px}.network-note small{display:block;color:#8f7c6d;font-size:9px;margin-top:2px}
.toast{position:fixed;left:50%;bottom:24px;z-index:120;transform:translate(-50%,20px);opacity:0;pointer-events:none;background:#3e342c;color:white;padding:11px 15px;border-radius:999px;font-size:11px;font-weight:750;box-shadow:0 12px 30px rgba(48,34,24,.2);transition:.25s ease}.toast.show{opacity:1;transform:translate(-50%,0)}

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

@media (max-width: 1050px) {
  .site-header { grid-template-columns:1fr auto; }
  .desktop-nav { display:none; }
  .mobile-menu-button { display:flex; }
  .mobile-menu { position:fixed; top:98px; left:20px; right:20px; z-index:49; border-radius:24px; background:rgba(255,253,249,.95); border:1px solid rgba(255,255,255,.9); box-shadow:0 22px 60px rgba(71,51,36,.16); backdrop-filter:blur(18px); padding:10px; }
  .mobile-menu.open{display:grid}.mobile-menu a{padding:14px 15px;border-radius:14px;font-size:13px;font-weight:800;color:#6f6156}.mobile-menu a:hover{background:#f5e8dc}
  .hero { grid-template-columns:1fr; padding-top:60px; text-align:center; gap:5px; }
  .hero-copy { order:2; }.hero-visual{order:1;min-height:560px}.hero h1,.hero-description{margin-left:auto;margin-right:auto}.hero-ctas,.hero-notes{justify-content:center}.hero h1{font-size:clamp(54px,10vw,82px)}
  .section-heading { grid-template-columns:1fr; align-items:start; }.section-heading p{max-width:700px}
  .quest-grid{grid-template-columns:1fr 1fr}.quest-card:last-child{grid-column:1/-1;max-width:calc(50% - 9px);width:100%;margin:auto}
  .split-panel{grid-template-columns:1fr}.journey-card{min-height:570px}
  .record-wrap{grid-template-columns:1fr;gap:30px}.record-copy{text-align:center}.record-copy>p{margin-left:auto;margin-right:auto}.record-points{max-width:600px;margin-left:auto;margin-right:auto}.record-copy .primary-button{margin:auto}
  .final-cta{grid-template-columns:220px 1fr;padding:42px}.final-cta img{width:220px}
}

@media (max-width: 720px) {
  .site-header { width:calc(100% - 20px); margin-top:10px; top:8px; min-height:64px; padding:8px 9px 8px 12px; }
  .brand-avatar{width:38px;height:38px}.brand-word{font-size:17px}.icon-button{display:none}.wallet-button{min-height:42px;padding:0 13px;font-size:11px}.mobile-menu-button{width:42px;height:42px}
  .section-shell{width:calc(100% - 26px)}
  .hero{padding:34px 0 55px}.hero-visual{min-height:420px}.mascot-stage{width:min(360px,84vw)}.orbital-card{font-size:0;padding:7px}.orbital-icon{width:31px;height:31px}.orbital-one{left:3%;top:23%}.orbital-two{right:3%;top:15%}.orbital-three{right:1%;bottom:20%}.orbital-four{left:3%;bottom:19%}.quest-chip{min-width:84px;padding:9px 11px}.quest-chip span{font-size:7px}.quest-chip strong{font-size:11px}.chip-left{left:4%;bottom:7%}.chip-right{right:2%;top:5%}
  .hero h1{font-size:clamp(44px,13vw,62px)}.hero-description{font-size:15px;line-height:1.6}.hero-ctas{display:grid}.primary-button,.secondary-button{width:100%}.hero-notes{gap:10px;font-size:10px}
  .soft-strip{width:calc(100% - 20px);justify-content:flex-start;gap:12px;padding:14px 15px;overflow:hidden}.strip-star{display:none}.soft-strip div:not(.strip-star){width:calc(50% - 6px);font-size:10px}
  .content-section{padding-top:78px}.section-heading h2,.split-copy h2,.record-copy h2,.final-cta h2{font-size:clamp(38px,11vw,54px)}
  .quest-grid{grid-template-columns:1fr}.quest-card:last-child{grid-column:auto;max-width:none}.quest-art{height:200px}
  .split-panel{padding:12px;border-radius:27px}.split-copy{padding:30px 14px}.journey-card{min-height:530px;padding:15px}.journey-map{height:410px}.journey-mascot{width:180px}.path-node{width:52px}.path-node span{width:42px;height:42px}.journey-bottom{left:14px;right:14px;bottom:14px}.journey-bottom button{padding:9px 11px}
  .record-points{grid-template-columns:1fr;text-align:left;max-width:290px}.profile-main{padding:0 15px}.profile-avatar{width:70px;height:70px}.level-pill{font-size:7px}.xp-box{margin:20px 15px}.badge-row{padding:0 15px 18px;gap:6px}.badge-row div{padding:13px 4px}.profile-footer{padding:14px 15px;align-items:flex-start;flex-direction:column;gap:8px}
  .faq-grid{grid-template-columns:1fr}
  .final-cta{width:calc(100% - 26px);grid-template-columns:1fr;text-align:center;padding:35px 24px;margin-top:80px}.final-cta img{width:185px;margin:auto}.final-cta .eyebrow{justify-content:center}.final-cta p{margin-left:auto;margin-right:auto}
  .site-footer{width:calc(100% - 26px);grid-template-columns:1fr}.footer-links{justify-content:flex-start;flex-wrap:wrap}.footer-note{grid-column:auto}
  .modal-card{padding:29px 20px}
}

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


/* Dedicated questboard */
.desktop-nav .nav-active { color: var(--ink); background: rgba(147, 104, 74, .08); }
.journey-link { min-height:42px; padding:0 15px; border-radius:12px; background:#9e704f; color:white; display:inline-flex; align-items:center; gap:9px; justify-content:center; font-size:11px; font-weight:850; transition:.2s ease; }
.journey-link:hover { transform:translateY(-1px); background:#875b3e; }
.quest-page-hero { min-height:560px; padding:82px 0 34px; display:grid; grid-template-columns:1.15fr .85fr; gap:48px; align-items:center; }
.quest-page-copy h1 { margin:18px 0 0; max-width:780px; font-size:clamp(58px,6.6vw,94px); line-height:.94; letter-spacing:-.06em; }
.quest-page-copy h1 span { color:#a87250; }
.quest-page-copy p { max-width:650px; margin:26px 0 0; color:#78695e; line-height:1.7; font-size:17px; }
.quest-page-mascot { min-height:410px; position:relative; display:grid; place-items:center; }
.quest-page-mascot img { position:relative; z-index:2; width:min(330px,72%); filter:drop-shadow(0 25px 30px rgba(87,60,39,.13)); animation:float 5s ease-in-out infinite; }
.quest-page-halo { position:absolute; width:min(430px,90%); aspect-ratio:1; border-radius:50%; background:linear-gradient(145deg,rgba(255,255,255,.9),rgba(236,213,189,.54)); border:1px dashed rgba(157,113,77,.2); box-shadow:0 28px 70px rgba(125,91,58,.11),inset 0 0 0 12px rgba(255,255,255,.54); }
.floating-badge { position:absolute; z-index:4; padding:10px 13px; border-radius:999px; background:rgba(255,253,249,.93); border:1px solid rgba(145,101,68,.1); box-shadow:0 12px 28px rgba(84,59,40,.1); color:#7b6656; font-size:10px; font-weight:900; letter-spacing:.05em; }
.badge-one { right:5%; top:20%; transform:rotate(4deg); }
.badge-two { left:5%; bottom:20%; transform:rotate(-4deg); }
.quest-status-strip { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-top:5px; }
.quest-status-strip > div { min-height:78px; padding:17px 18px; border-radius:20px; background:rgba(255,253,249,.68); border:1px solid rgba(116,82,57,.09); display:grid; grid-template-columns:auto 1fr; column-gap:10px; align-items:center; box-shadow:0 14px 36px rgba(91,64,44,.055); }
.quest-status-strip strong { font-size:12px; }
.quest-status-strip small { grid-column:2; color:#8b7b6f; font-size:10px; margin-top:-13px; }
.status-dot-live,.status-dot-build { width:9px;height:9px;border-radius:50%;display:block;grid-row:1/3; }
.status-dot-live { background:#a7c39c; box-shadow:0 0 0 5px rgba(167,195,156,.14); }
.status-dot-build { background:#d5a67f; box-shadow:0 0 0 5px rgba(213,166,127,.14); }
.quest-page-board { padding-top:90px; }
.quest-bottom-note { margin-top:90px; margin-bottom:30px; padding:34px 38px; min-height:240px; border-radius:34px; background:linear-gradient(135deg,rgba(255,253,249,.84),rgba(244,227,210,.72)); border:1px solid rgba(255,255,255,.88); box-shadow:var(--shadow); display:grid; grid-template-columns:180px 1fr; align-items:center; gap:34px; overflow:hidden; }
.quest-bottom-note img { width:180px; filter:drop-shadow(0 18px 20px rgba(90,60,40,.12)); }
.quest-bottom-note h2 { margin:12px 0 0; font-size:clamp(34px,4vw,55px); line-height:1; letter-spacing:-.05em; }
.quest-bottom-note p { max-width:680px; margin:15px 0 0; color:#7c6d61; line-height:1.65; font-size:13px; }
@media(max-width:900px){
  .quest-page-hero{grid-template-columns:1fr; padding-top:64px; text-align:center; gap:10px}.quest-page-copy p{margin-left:auto;margin-right:auto}.quest-page-mascot{min-height:360px}.quest-status-strip{grid-template-columns:1fr}.quest-bottom-note{grid-template-columns:130px 1fr}.quest-bottom-note img{width:130px}
}
@media(max-width:600px){
  .quest-page-hero{min-height:auto;padding-top:50px}.quest-page-copy h1{font-size:clamp(48px,14vw,66px)}.quest-page-copy p{font-size:15px}.quest-page-mascot{min-height:300px}.quest-page-mascot img{width:230px}.quest-page-halo{width:285px}.floating-badge{font-size:8px}.quest-status-strip{width:calc(100% - 30px)}.quest-page-board{padding-top:70px}.quest-bottom-note{grid-template-columns:1fr;text-align:center;padding:28px 22px}.quest-bottom-note img{width:120px;margin:auto}.quest-bottom-note h2{font-size:38px}.quest-bottom-note p{margin-left:auto;margin-right:auto}
}