@font-face{font-family:Nunito;src:url("assets/fonts/Nunito-Latin.woff2") format("woff2");font-style:normal;font-weight:400 900;font-display:swap}
@font-face{font-family:"DM Mono";src:url("assets/fonts/DMMono-Latin.woff2") format("woff2");font-style:normal;font-weight:400;font-display:swap}
:root{--navy:#080c24;--panel:#0d1330;--lime:#96ea11;--cyan:#00a4ff;--royal:#0329e8;--white:#f8fbff;--muted:#c9d5ea;--font-ui:Nunito,Arial,sans-serif;--font-mono:"DM Mono",ui-monospace,Menlo,Consolas,monospace}
*{box-sizing:border-box}
html{background:var(--navy);scroll-behavior:smooth}
body{margin:0;min-width:320px;color:var(--white);font-family:var(--font-ui);background:#080c24;overflow-x:hidden}
button{font:inherit;cursor:pointer}
.icon-library{position:absolute;width:0;height:0;overflow:hidden}
.site{overflow:hidden}
.chapter{position:relative;isolation:isolate;min-height:950px;display:grid;place-items:center;padding:65px 40px;background:radial-gradient(ellipse 58% 65% at 3% 20%,rgba(87,164,88,.2),transparent 70%),radial-gradient(ellipse 55% 65% at 96% 75%,rgba(3,41,232,.31),transparent 70%),#080c24}
.chapter:before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(255,255,255,.015),transparent 40%,rgba(255,255,255,.012));pointer-events:none}
.chapter:after{content:"";position:absolute;left:8%;right:8%;bottom:0;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.16),transparent)}
.chapter-earned{background:radial-gradient(ellipse 65% 70% at 9% 48%,rgba(112,179,31,.23),transparent 68%),radial-gradient(ellipse 60% 80% at 95% 15%,rgba(0,96,211,.26),transparent 68%),#090c22}
.chapter-wallet{background:radial-gradient(ellipse 55% 75% at 87% 43%,rgba(0,140,199,.24),transparent 69%),radial-gradient(ellipse 70% 70% at 3% 93%,rgba(85,43,149,.21),transparent 73%),#080c24}
.chapter-redeemed{background:radial-gradient(ellipse 63% 75% at 14% 39%,rgba(25,160,116,.25),transparent 69%),radial-gradient(ellipse 55% 70% at 98% 85%,rgba(3,41,232,.27),transparent 70%),#080c24}
.chapter-inner{width:min(1220px,100%);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:clamp(36px,6vw,100px);margin:auto}
.chapter-copy{max-width:520px;justify-self:center;width:100%}
.chapter.reverse .chapter-copy{grid-column:2;grid-row:1}
.chapter.reverse .device-stage{grid-column:1;grid-row:1}
.chapter-label{display:flex;align-items:center;gap:13px;color:#bfdda2;font:700 12px var(--font-mono);letter-spacing:.13em}
.chapter-label:before{content:"";width:27px;height:1px;background:linear-gradient(90deg,var(--lime),var(--cyan))}
.chapter-copy h1,.chapter-copy h2{max-width:550px;margin:27px 0 23px;font-size:clamp(56px,5.5vw,82px);font-weight:600;letter-spacing:-.063em;line-height:.97;text-wrap:balance}
.chapter-copy em{font-style:normal;font-weight:600;background:linear-gradient(110deg,#b5f54c 5%,#63d6fa 65%,#a5b5ff);background-clip:text;-webkit-background-clip:text;color:transparent}
.chapter-copy p{max-width:435px;margin:0;color:#d6dfed;font-size:18px;font-weight:500;line-height:1.65}
.device-stage{min-height:850px;position:relative;display:grid;place-items:center;perspective:1600px}
.stage-orbit{position:absolute;width:700px;height:700px;border-radius:50%;background:radial-gradient(circle,rgba(0,164,255,.2),rgba(3,41,232,.11) 32%,transparent 68%);pointer-events:none}
.chapter-earned .stage-orbit,.chapter-redeemed .stage-orbit{background:radial-gradient(circle,rgba(150,234,17,.18),rgba(0,164,255,.1) 35%,transparent 70%)}
.iphone{width:420px;height:850px;position:relative;z-index:1;padding:9px;overflow:hidden;border:1px solid rgba(255,255,255,.57);border-radius:59px;background:linear-gradient(132deg,#646d80,#141a2a 12%,#06080f 58%,#38508c);box-shadow:0 52px 92px rgba(0,0,0,.65),0 0 0 3px rgba(3,7,20,.7),inset 0 1px rgba(255,255,255,.4);transform:rotateY(-5deg) rotateZ(1deg);transition:transform .6s cubic-bezier(.2,.8,.2,1),box-shadow .6s}
.reverse .iphone{transform:rotateY(5deg) rotateZ(-1deg)}
.device-stage:hover .iphone{transform:rotateY(0) rotateZ(0) translateY(-7px);box-shadow:0 65px 110px rgba(0,0,0,.72),0 0 0 3px rgba(3,7,20,.7),inset 0 1px rgba(255,255,255,.4)}
.iphone:before{content:"";position:absolute;inset:0;z-index:80;border-radius:inherit;background:linear-gradient(130deg,rgba(255,255,255,.3),transparent 11%,transparent 86%,rgba(255,255,255,.14));pointer-events:none}
.screen{position:relative;height:100%;overflow:hidden;border-radius:49px;background:#080c24;isolation:isolate}
.dynamic-island{position:absolute;z-index:52;top:10px;left:50%;width:105px;height:28px;border-radius:20px;transform:translateX(-50%);background:#020207;box-shadow:0 1px 1px rgba(255,255,255,.08)}
.ios-status{position:absolute;z-index:51;top:0;left:0;right:0;height:49px;padding:17px 24px 0;display:flex;justify-content:space-between;color:#fff;background:#060919;font:800 12px var(--font-mono)}
.status-right{display:block;width:52px;height:18px}.status-right svg{display:block;width:52px;height:18px;color:#fff}
.home-indicator{position:absolute;z-index:70;left:50%;bottom:6px;width:108px;height:4px;border-radius:4px;transform:translateX(-50%);background:rgba(255,255,255,.88)}

/* The first phone is the app camera surface. It has iOS camera controls, without app tabs. */
.iphone-camera .screen{background:#0b141b}
.camera-feed{position:absolute;inset:-12px;background:#17141e url("tokencamera.png") center bottom/auto 125% no-repeat;overflow:hidden;filter:saturate(.9) brightness(.82);transform:translate3d(var(--camera-x,0px),var(--camera-y,0px),0);transition:transform .25s ease-out;will-change:transform}
.camera-feed:after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 130% 60% at 50% 40%,transparent 17%,rgba(0,0,0,.27) 100%)}
.iphone-camera .ios-status{background:rgba(3,8,13,.92)}
.camera-toolbar{position:absolute;z-index:10;top:66px;left:22px;right:22px;display:flex;justify-content:space-between}
.camera-tool{display:grid;place-items:center;width:42px;height:42px;border:1px solid rgba(255,255,255,.2);border-radius:50%;background:rgba(8,12,18,.5);backdrop-filter:blur(14px);font-size:23px;font-weight:500}
.camera-guide{position:absolute;z-index:2;left:50%;top:50%;width:238px;height:238px;transform:translate(-50%,-50%);border:1px solid rgba(255,255,255,.27);border-radius:24px;box-shadow:0 0 0 500px rgba(0,0,0,.12)}
.guide-corner{position:absolute;width:35px;height:35px;border:4px solid var(--lime)}
.top-left{top:-2px;left:-2px;border-right:0;border-bottom:0;border-radius:18px 0 0 0}.top-right{top:-2px;right:-2px;border-left:0;border-bottom:0;border-radius:0 18px 0 0}.bottom-left{bottom:-2px;left:-2px;border-right:0;border-top:0;border-radius:0 0 0 18px}.bottom-right{bottom:-2px;right:-2px;border-left:0;border-top:0;border-radius:0 0 18px 0}
.guide-line{position:absolute;left:16px;right:16px;top:50%;height:2px;background:var(--lime);box-shadow:0 0 16px var(--lime);animation:scan 3.2s ease-in-out infinite alternate}
.scan-prompt{position:absolute;z-index:4;left:50%;top:calc(50% + 143px);width:max-content;max-width:calc(100% - 32px);margin:0;padding:8px 12px;border:1px solid rgba(255,255,255,.16);border-radius:12px;background:rgba(5,9,24,.72);backdrop-filter:blur(8px);color:#fff;font-size:14px;font-weight:800;text-align:center;transform:translateX(-50%)}
.camera-control-area{position:absolute;z-index:6;left:0;right:0;bottom:42px;display:grid;justify-items:center;gap:15px}
.camera-modes{display:flex;align-items:center;gap:24px;color:rgba(255,255,255,.63);font:800 11px var(--font-mono);letter-spacing:.05em}
.camera-modes strong{color:#f5e675;font-weight:800}
.scan-indicator{display:flex;align-items:center;gap:8px;color:#dcece5;font:700 9px var(--font-mono);letter-spacing:.08em}
.scan-pulse{width:7px;height:7px;border-radius:50%;background:var(--lime);box-shadow:0 0 0 4px rgba(150,234,17,.12),0 0 12px rgba(150,234,17,.45);animation:glow 2.8s ease-in-out infinite}

/* Shared app chrome from the newdirection2 visual system. */
.app-screen{background:radial-gradient(ellipse 105% 340px at 0 0,rgba(150,234,17,.15),transparent 66%),radial-gradient(ellipse 100% 430px at 100% 48%,rgba(0,164,255,.16),transparent 70%),#080c24}
.app-scroll{position:absolute;inset:49px 0 86px;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:none;padding:12px 19px 28px}
.app-scroll::-webkit-scrollbar{display:none}
.app-header{height:53px;display:flex;align-items:center;justify-content:space-between;padding-bottom:12px;border-bottom:1px solid rgba(255,255,255,.14)}
.app-logo{display:block;width:auto;height:31px;filter:brightness(0) invert(1)}
.header-actions{display:flex;align-items:center;gap:8px}
.menu-button,.avatar{width:40px;height:40px;display:grid;place-items:center;padding:0;border:1px solid rgba(255,255,255,.24);border-radius:50%;background:rgba(255,255,255,.08);color:#fff}
.menu-button{font-size:17px}.avatar{border:0;background:linear-gradient(145deg,var(--lime),var(--cyan));color:#081328;font-size:12px;font-weight:900}
.app-tabs{position:absolute;z-index:50;left:0;right:0;bottom:0;height:86px;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));padding:8px 7px 22px;border-top:1px solid rgba(255,255,255,.1);background:rgba(10,15,42,.96);box-shadow:0 -10px 30px rgba(4,7,25,.7);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px)}
.app-tabs button{min-width:0;min-height:52px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:0;border:0;background:none;color:#b5c1d8;font-size:11px;font-weight:800;line-height:1.1}
.tab-icon{width:42px;height:29px;display:grid;place-items:center;border-radius:14px}
.tab-icon img{display:block;width:24px;height:24px;object-fit:contain;filter:brightness(0) invert(1);opacity:.72}
.app-tabs button.active{color:var(--lime)}
.app-tabs button.active .tab-icon{background:rgba(150,234,17,.18)}
.app-tabs button.active .tab-icon img{filter:brightness(0) saturate(100%) invert(83%) sepia(76%) saturate(668%) hue-rotate(29deg) brightness(104%) contrast(97%);opacity:1}
.screen-eyebrow{display:block;color:var(--lime);font:800 10px var(--font-mono);letter-spacing:.12em}

/* Earned reward */
.reward-view{padding-top:36px;text-align:center}
.reward-emblem{width:178px;height:178px;position:relative;display:grid;place-items:center;margin:18px auto 28px;border-radius:50%;background:radial-gradient(circle,rgba(150,234,17,.19),transparent 62%)}
.reward-ring{position:absolute;border:1px solid rgba(0,164,255,.38);border-radius:50%;animation:ring 8s linear infinite}.ring-one{inset:9px}.ring-two{inset:0;border-style:dashed;animation-direction:reverse;animation-duration:13s}
.reward-coin{width:90px;height:90px;display:grid;place-items:center;border:5px solid #d6f9a0;border-radius:50%;background:linear-gradient(145deg,#b2f154,#6dc917);box-shadow:0 0 0 7px rgba(150,234,17,.16),0 12px 30px rgba(0,0,0,.35);color:#153103;font-size:21px;font-weight:900}
.reward-spark{position:absolute;color:var(--lime);font-size:23px;animation:float 2.6s ease-in-out infinite}.spark-one{right:3px;top:10px}.spark-two{left:5px;bottom:20px;color:var(--cyan);animation-delay:.9s}
.reward-view h3{margin:0;font-size:34px;font-weight:800;line-height:1.06;letter-spacing:-.055em}.reward-view h3 span{color:var(--lime)}
.reward-view p{max-width:275px;margin:13px auto 24px;color:#d1dded;font-size:15px;line-height:1.5}
.balance-feedback{display:flex;justify-content:space-between;align-items:center;padding:17px 19px;border:1px solid rgba(150,234,17,.39);border-radius:17px;background:linear-gradient(120deg,rgba(150,234,17,.16),rgba(0,164,255,.1));text-align:left}
.balance-feedback small{display:block;margin-bottom:3px;color:#c8eaf1;font:700 10px var(--font-mono);letter-spacing:.08em}.balance-feedback strong{font-size:23px;letter-spacing:-.03em}.balance-feedback>span{color:var(--lime);font:800 17px var(--font-mono)}
.app-primary{width:100%;min-height:48px;display:flex;align-items:center;justify-content:center;gap:10px;margin-top:15px;border:0;border-radius:12px;background:linear-gradient(105deg,#0329e8,#146bfa);box-shadow:0 9px 26px rgba(3,41,232,.42);color:#fff;font-size:15px;font-weight:900}.app-primary span{font-size:18px}

/* Account, quests and prizes */
.account-label{margin:22px 2px 12px;color:#b8d9ec}
.balance-hero{min-height:148px;position:relative;display:flex;justify-content:space-between;align-items:end;overflow:hidden;padding:18px;border:1px solid rgba(200,255,182,.45);border-radius:20px;background:linear-gradient(125deg,#255b21 0%,#117a60 52%,#073a85 100%);box-shadow:0 14px 32px rgba(0,0,0,.3)}
.balance-hero:before{content:"";position:absolute;width:180px;height:180px;right:-48px;top:-71px;border:1px solid rgba(255,255,255,.29);border-radius:50%;box-shadow:0 0 0 19px rgba(255,255,255,.06),0 0 0 49px rgba(255,255,255,.045)}
.balance-hero>div{position:relative}.balance-hero small{color:#d8ffe1;font:700 10px var(--font-mono);letter-spacing:.1em}.balance-hero strong{display:block;margin:9px 0 0;font-size:44px;font-weight:900;line-height:.9;letter-spacing:-.065em}.balance-hero strong span{font-size:22px;letter-spacing:-.04em}.balance-hero p{margin:10px 0 0;color:#e3f5ec;font-size:12px}.hero-token{width:48px;height:48px;display:grid;place-items:center;flex:0 0 48px;border:3px solid #f1ffd9;border-radius:50%;background:var(--lime);box-shadow:0 6px 15px rgba(0,0,0,.22);color:#173603;font-size:13px;font-weight:900}
.in-app-heading{display:flex;align-items:baseline;justify-content:space-between;margin:21px 2px 10px}.in-app-heading h3{margin:0;font-size:19px;font-weight:900;letter-spacing:-.045em}.in-app-heading span{color:#7cd2ff;font:700 10px var(--font-mono);letter-spacing:.05em}
.quest-cards{display:grid;gap:8px}.quest-card{min-height:69px;display:flex;align-items:center;gap:11px;padding:9px 11px;border:1px solid rgba(255,255,255,.17);border-radius:15px;box-shadow:inset 0 1px rgba(255,255,255,.07)}
.quest-purple{background:linear-gradient(105deg,rgba(94,57,167,.48),rgba(23,25,62,.84))}.quest-blue{background:linear-gradient(105deg,rgba(8,110,171,.45),rgba(19,28,68,.84))}.quest-green{background:linear-gradient(105deg,rgba(49,134,84,.4),rgba(20,36,63,.84))}
.quest-icon{width:43px;height:43px;display:grid;place-items:center;flex:0 0 43px;border-radius:12px;background:linear-gradient(145deg,#b388ff,#6b43da);box-shadow:0 7px 16px rgba(0,0,0,.24);color:#fff}.quest-blue .quest-icon{background:linear-gradient(145deg,#53c8ff,#1670dd)}.quest-green .quest-icon{background:linear-gradient(145deg,#a8eb47,#3b9c53)}
.quest-icon svg,.prize-art svg,.success-emblem svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.quest-card>div{min-width:0;flex:1}.quest-card small{display:block;margin-bottom:4px;color:#c8eaff;font:700 11px var(--font-mono);letter-spacing:.05em}.quest-card strong{display:block;font-size:16px;font-weight:800;line-height:1.15}.quest-card>b{padding:7px 8px;border:1px solid rgba(150,234,17,.35);border-radius:8px;background:rgba(150,234,17,.15);color:#d4ff9d;font:700 11px var(--font-mono);white-space:nowrap}
.more-quests{width:100%;display:flex;justify-content:center;gap:8px;margin:8px 0 0;padding:7px;border:0;background:none;color:#a9dcff;font-size:12px;font-weight:800}.more-quests span{font-size:16px;line-height:1}
.prize-heading{margin-top:18px}.prize-card{min-height:84px;display:flex;align-items:center;gap:11px;margin-bottom:9px;padding:9px;border:1px solid rgba(255,255,255,.17);border-radius:15px;background:rgba(255,255,255,.065)}
.prize-art{width:65px;height:64px;display:grid;place-items:center;flex:0 0 65px;border-radius:11px;background:linear-gradient(140deg,#7543bd,#184abe);color:#fff}.prize-art.second{background:linear-gradient(140deg,#dc7e38,#b62d73)}.prize-art svg{width:30px;height:30px}
.prize-card>div{min-width:0;flex:1}.prize-card small{display:block;color:#a6dcff;font:700 10px var(--font-mono);letter-spacing:.04em}.prize-card strong{display:block;overflow:hidden;margin:3px 0;color:#fff;font-size:16px;font-weight:800;white-space:nowrap;text-overflow:ellipsis}.prize-card>div>span{color:#ccd9ea;font-size:12px}.prize-card>b{color:#c9fa86;font:800 12px var(--font-mono);white-space:nowrap}

/* Confirmation remains above account content and below the fixed app tab bar. */
.success-overlay{position:absolute;z-index:35;inset:49px 0 86px;display:grid;place-items:center;padding:20px;background:rgba(4,8,26,.59);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}
.success-sheet{width:100%;padding:27px 20px 20px;border:1px solid rgba(150,234,17,.43);border-radius:25px;background:radial-gradient(circle at 50% 0,rgba(150,234,17,.14),transparent 55%),linear-gradient(145deg,#14234b,#0c1434 72%);box-shadow:0 24px 50px rgba(0,0,0,.6),0 0 44px rgba(0,164,255,.14);text-align:center}
.success-emblem{width:75px;height:75px;display:grid;place-items:center;margin:0 auto 19px;border:2px solid var(--lime);border-radius:50%;background:rgba(150,234,17,.13);box-shadow:0 0 0 9px rgba(150,234,17,.06),0 0 29px rgba(150,234,17,.3);color:var(--lime);animation:glow 2.8s ease-in-out infinite}.success-emblem svg{width:38px;height:38px;stroke-width:2.5}
.success-sheet h3{margin:13px 0 12px;font-size:34px;font-weight:800;line-height:1.05;letter-spacing:-.06em}.success-sheet h3 em{color:var(--lime);font-style:normal}.success-sheet p{margin:0 0 21px;color:#d9e4f4;font-size:15px}.success-balance{display:flex;justify-content:space-between;align-items:center;padding:13px;border:1px solid rgba(255,255,255,.17);border-radius:11px;background:rgba(255,255,255,.06);text-align:left}.success-balance span{color:#b9cfdd;font:700 10px var(--font-mono)}.success-balance strong{color:var(--lime);font-size:17px}.success-sheet .app-primary{margin-top:15px;background:var(--lime);box-shadow:0 8px 20px rgba(150,234,17,.2);color:#163400}

@keyframes scan{to{transform:translateY(70px)}}@keyframes ring{to{transform:rotate(1turn)}}@keyframes float{50%{transform:translateY(-7px)}}@keyframes glow{50%{box-shadow:0 0 0 12px rgba(150,234,17,.03),0 0 38px rgba(150,234,17,.5)}}
@media(max-width:1060px){.chapter{padding:70px 28px}.chapter-inner{gap:28px}.iphone{width:380px;height:770px}.device-stage{min-height:790px}.stage-orbit{width:610px;height:610px}.chapter-copy h1,.chapter-copy h2{font-size:clamp(54px,5vw,70px)}.chapter-copy p{font-size:16px}}
@media(max-width:820px){.chapter{min-height:auto;padding:74px 24px 90px}.chapter-inner{max-width:580px;grid-template-columns:1fr;gap:38px}.chapter-copy,.chapter.reverse .chapter-copy{grid-column:1;grid-row:1;justify-self:start}.device-stage,.chapter.reverse .device-stage{grid-column:1;grid-row:2;min-height:790px}.iphone,.reverse .iphone{transform:none}.chapter-copy h1,.chapter-copy h2{margin:20px 0;font-size:clamp(50px,8vw,72px)}.chapter-copy p{font-size:17px}.stage-orbit{width:680px;height:680px}}
@media(max-width:480px){.chapter{padding:57px 17px 65px}.chapter-copy h1,.chapter-copy h2{font-size:clamp(47px,12vw,60px)}.chapter-copy p{font-size:16px}.device-stage{min-height:820px!important}.iphone{width:min(350px,calc(100vw - 36px));height:820px;border-radius:53px}.screen{border-radius:44px}.stage-orbit{width:510px;height:510px}.app-scroll{padding:10px 14px 24px}.app-header{height:48px}.app-logo{height:27px}.menu-button,.avatar{width:35px;height:35px}.app-tabs{height:80px;padding-bottom:18px}.app-tabs button{font-size:11px}.tab-icon{height:27px}.tab-icon img{width:23px;height:23px}.app-scroll{bottom:80px}.success-overlay{bottom:80px}.reward-view{padding-top:20px}.reward-emblem{width:139px;height:139px;margin:12px auto 16px}.reward-coin{width:74px;height:74px;font-size:18px}.reward-view h3{font-size:29px}.reward-view p{margin:9px auto 16px;font-size:14px}.balance-feedback{padding:12px 14px}.balance-feedback strong{font-size:20px}.balance-hero{min-height:130px;padding:14px}.balance-hero strong{font-size:38px}.account-label{margin:14px 2px 9px}.in-app-heading{margin:15px 2px 8px}.quest-card{min-height:69px;padding:7px 8px}.quest-icon{width:40px;height:40px;flex-basis:40px}.quest-card strong{font-size:15px}.quest-card small{font-size:10px}.quest-card>b{font-size:10px}.prize-card{min-height:78px}.prize-art{width:55px;height:55px;flex-basis:55px}.prize-card strong{font-size:15px}.prize-card>b{font-size:10px}.success-sheet{padding:22px 17px 17px}.success-sheet h3{font-size:30px}.camera-guide{width:210px;height:210px}.camera-control-area{bottom:28px}.scan-prompt{top:calc(50% + 124px)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.iphone,.camera-feed,.reward-ring,.reward-spark,.guide-line,.success-emblem{animation:none!important;transition:none!important}}