*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--navy:#0b1e3d;--blue:#2563eb;--accent:#f59e0b;--white:#fff;--whiteB:#6eadffad;--light-grey:#f5f7fa;--text-primary:#0b1e3d;--text-secondary:#6b7a99;--success:#22c55e;--error:#ef4444;--border-radius:8px;--border-radius-lg:12px}body{background-color:var(--navy);color:var(--text-primary);margin-top:75px;font-family:Inter,sans-serif;font-size:16px;line-height:1.6}a{color:inherit;text-decoration:none}ul{list-style:none}button{cursor:pointer;border:none;font-family:inherit}img{max-width:100%}.token-icon{vertical-align:-3px;filter:drop-shadow(0 1px 3px #0000008c);width:17px;height:17px}.icon-close-btn{border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:32px;height:32px;padding:0;transition:background-color .2s,color .2s,border-color .2s;display:flex}.icon-close-btn svg{width:15px;height:15px}.icon-close-btn-corner{position:absolute;top:20px;right:20px}.icon-close-btn-light{background-color:var(--light-grey);color:var(--text-secondary);border:none}.icon-close-btn-light:hover{background-color:var(--navy);color:var(--white)}.icon-close-btn-dark{color:#fff9;background-color:#ffffff0f;border:1px solid #ffffff26}.icon-close-btn-dark:hover{color:var(--white);background-color:#ffffff1f;border-color:#ffffff4d}body.modal-open:after{content:"";z-index:999;background-color:#0009;width:100%;height:100%;position:fixed;top:0;left:0}html::-webkit-scrollbar{width:6px}html::-webkit-scrollbar-track{background:#ffffff08}html::-webkit-scrollbar-thumb{background-color:#ffffff26;border-radius:10px}html::-webkit-scrollbar-thumb:hover{background-color:var(--accent)}html,body{overflow-x:hidden}.counter{color:var(--accent);background:var(--accent-bg);border:2px solid #0000;border-radius:5px;margin-bottom:24px;padding:5px 10px;font-size:16px;transition:border-color .3s}.counter:hover{border-color:var(--accent-border)}.counter:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.hero{position:relative}.hero .base,.hero .framework,.hero .vite{margin:0 auto;inset-inline:0}.hero .base{z-index:0;width:170px;position:relative}.hero .framework,.hero .vite{position:absolute}.hero .framework{z-index:1;height:28px;top:34px;transform:perspective(2000px)rotate(300deg)rotateX(44deg)rotateY(39deg)scale(1.4)}.hero .vite{z-index:0;width:auto;height:26px;top:107px;transform:perspective(2000px)rotate(300deg)rotateX(40deg)rotateY(39deg)scale(.8)}#center{flex-direction:column;flex-grow:1;place-content:center;place-items:center;gap:25px;display:flex}@media (width<=1024px){#center{gap:18px;padding:32px 20px 24px}}#next-steps{border-top:1px solid var(--border);text-align:left;display:flex}#next-steps>div{flex:1 1 0;padding:32px}@media (width<=1024px){#next-steps>div{padding:24px 20px}}#next-steps .icon{width:22px;height:22px;margin-bottom:16px}@media (width<=1024px){#next-steps{text-align:center;flex-direction:column}}#docs{border-right:1px solid var(--border)}@media (width<=1024px){#docs{border-right:none;border-bottom:1px solid var(--border)}}#next-steps ul{gap:8px;margin:32px 0 0;padding:0;list-style:none;display:flex}#next-steps ul .logo{height:18px}#next-steps ul a{color:var(--text-h);background:var(--social-bg);border-radius:6px;align-items:center;gap:8px;padding:6px 12px;font-size:16px;text-decoration:none;transition:box-shadow .3s;display:flex}#next-steps ul a:hover{box-shadow:var(--shadow)}#next-steps ul a .button-icon{width:18px;height:18px}@media (width<=1024px){#next-steps ul{flex-wrap:wrap;justify-content:center;margin-top:20px}#next-steps ul li{flex:calc(50% - 8px)}#next-steps ul a{box-sizing:border-box;justify-content:center;width:100%}}#spacer{border-top:1px solid var(--border);height:88px}@media (width<=1024px){#spacer{height:48px}}.ticks{width:100%;position:relative}.ticks:before,.ticks:after{content:"";border:5px solid #0000;position:absolute;top:-4.5px}.ticks:before{border-left-color:var(--border);left:0}.ticks:after{border-right-color:var(--border);right:0}nav{z-index:100;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);-webkit-mask-image:linear-gradient(#000 0% 96%,#0000 0%);background:linear-gradient(90deg,#0b1e3dfa 0%,#0b1e3dbf 25% 75%,#0b1e3dfa 100%);justify-content:space-between;align-items:center;width:100%;padding:16px 80px 26px;display:flex;position:fixed;top:0;mask-image:linear-gradient(#000 0% 92%,#0000 100%)}nav a{color:var(--white);font-size:14px;font-weight:500;transition:opacity .2s}nav a:hover{opacity:.7}nav a.active{background-color:var(--accent);color:var(--navy);border-radius:var(--border-radius);padding:8px 20px;font-weight:600}nav div[aria-label=logo]{border-radius:var(--border-radius);width:130px;height:30px}.nav-logo{width:auto;max-height:60px}.logo-div{margin-bottom:15px!important}.nav-links{align-items:center;gap:32px;display:flex}.nav-right{align-items:center;gap:20px;display:flex}.nav-btn-outline{border-radius:var(--border-radius);color:var(--white);padding:8px 20px;font-weight:500;border:1.5px solid var(--white)!important}.nav-btn-solid{border-radius:var(--border-radius);background-color:var(--accent);padding:8px 20px;font-weight:600;color:var(--navy)!important}.nav-tokens{border-radius:var(--border-radius);background-color:#ffffff14;border:1px solid #ffffff1f;align-items:center;gap:6px;padding:6px 6px 6px 14px;display:flex}.nav-tokens-count{color:var(--white);font-weight:600}.nav-tokens-add{background-color:var(--accent);width:22px;height:22px;color:var(--navy);border-radius:50%;justify-content:center;align-items:center;font-size:14px;font-weight:700;line-height:1;transition:opacity .2s;display:flex}.nav-tokens-add:hover{opacity:.85}.nav-feedback-btn{color:#ffffffb3;background:0 0;border:1px solid #ffffff26;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:32px;height:32px;transition:background-color .2s,color .2s,border-color .2s;display:flex}.nav-feedback-btn svg{width:16px;height:16px}.nav-feedback-btn:hover{color:var(--white);background-color:#ffffff14;border-color:#ffffff4d}.nav-toggle-btn{border-radius:var(--border-radius);background:0 0;border:1px solid #ffffff26;flex-direction:column;flex-shrink:0;justify-content:center;align-items:center;gap:5px;width:38px;height:38px;padding:0;display:none}.nav-toggle-btn span{background-color:var(--white);border-radius:2px;width:18px;height:2px;transition:transform .25s,opacity .2s;display:block}.nav-toggle-btn:hover{background-color:#ffffff14}.nav-toggle-btn.open span:first-child{transform:translateY(7px)rotate(45deg)}.nav-toggle-btn.open span:nth-child(2){opacity:0}.nav-toggle-btn.open span:nth-child(3){transform:translateY(-7px)rotate(-45deg)}.nav-links-mobile{display:none}.nav-links-mobile a{color:var(--white);border-bottom:1px solid #ffffff14;padding:14px 18px;font-size:14px;font-weight:500;transition:background-color .2s;display:block}.nav-links-mobile a:last-child{border-bottom:none}.nav-links-mobile a:hover{opacity:1;background-color:#ffffff14}.nav-links-mobile a.active{background-color:var(--accent);color:var(--navy);font-weight:600}.nav-mobile-overlay{display:none}@media (width<=1024px){nav{padding:16px 40px 26px}.nav-links-desktop{gap:20px}nav a{font-size:13px}}@media (width<=768px){nav{padding:14px 20px 20px}.nav-toggle-btn{display:flex}.nav-links-desktop{display:none}.nav-mobile-overlay{z-index:140;background-color:#00000080;display:block;position:fixed;inset:0}.nav-links-mobile{border-radius:var(--border-radius);z-index:150;background-color:#1a2a4a;border:1px solid #ffffff26;flex-direction:column;min-width:200px;max-width:260px;display:flex;position:fixed;overflow:hidden;box-shadow:0 8px 24px #00000080}.nav-logo{margin-left:10px}}@media (width<=480px){nav{padding:12px 16px 21px}.nav-logo{width:100px;margin-left:10px}.nav-right{gap:10px}.nav-tokens{gap:4px;padding:5px 5px 5px 10px}.nav-tokens-count{font-size:12px}}.modal-overlay{z-index:1000;background-color:#00000080;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:fixed;top:0;left:0}.modal{background-color:var(--white);border-radius:var(--border-radius-lg);flex-direction:column;gap:16px;width:100%;max-width:480px;padding:40px;display:flex;position:relative}.modal h1{color:var(--navy);font-size:28px;font-weight:700}.modal h3{color:var(--text-secondary);font-size:16px;font-weight:400}.modal input{border-radius:var(--border-radius);border:1px solid #d1d5db;outline:none;width:100%;padding:12px 16px;font-family:inherit;font-size:14px;transition:border-color .2s}.modal input:focus{border-color:var(--blue)}.modal button:not(.icon-close-btn){background-color:var(--navy);width:100%;color:var(--white);border-radius:var(--border-radius);padding:12px;font-size:15px;font-weight:600;transition:background-color .2s}.modal button:not(.icon-close-btn):hover{background-color:var(--blue)}.modal-link{font-size:14px;font-weight:500;display:inline;color:var(--blue)!important;background:0 0!important;width:auto!important;padding:0!important}.modal-link:hover{text-decoration:underline;background:0 0!important}.modal-row{color:var(--text-secondary);align-items:center;gap:8px;font-size:14px;display:flex}.error-perm{margin-top:4px;font-size:14px;color:red!important}.verify-status{margin:-8px 0 0;font-size:14px;font-weight:500}.verify-status.verified{color:#16a34a}.modal .checkbox-row{flex-direction:row;align-items:center;gap:10px;display:flex}.modal .checkbox-row label{color:var(--text-secondary);cursor:pointer;font-size:13px}.modal .checkbox-row label a{color:var(--blue);text-decoration:underline}.modal .checkbox-row label a:hover{color:var(--navy)}.modal .modal-checkbox{cursor:pointer;width:18px;height:18px;accent-color:var(--blue);flex-shrink:0}.checkout-modal{background-color:var(--white);border-radius:var(--border-radius-lg);width:100%;max-width:480px;max-height:90vh;padding:40px;position:relative;overflow-y:auto}.tutorial-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1000;background-color:#0b1e3d99;justify-content:center;align-items:center;padding:24px;animation:.2s ease-out tutorial-fade-in;display:flex;position:fixed;inset:0}.tutorial-modal{background-color:var(--white);border-radius:var(--border-radius-lg);width:100%;max-width:620px;max-height:90vh;padding:44px 48px 32px;animation:.25s ease-out tutorial-rise-in;position:relative;overflow-y:auto;box-shadow:0 24px 64px #0b1e3d59}.tutorial-eyebrow{letter-spacing:.08em;text-transform:uppercase;color:var(--blue);margin-bottom:10px;font-size:12px;font-weight:700;display:inline-block}.tutorial-title{color:var(--navy);font-size:28px;font-weight:700;line-height:1.2}.tutorial-subtitle{color:var(--text-secondary);max-width:480px;margin-top:8px;font-size:15px}.tutorial-steps{margin:32px 0 8px;padding:0;list-style:none}.tutorial-step{gap:18px;padding-bottom:28px;display:flex;position:relative}.tutorial-step:last-child{padding-bottom:0}.tutorial-step:before{content:"";background:linear-gradient(#2563eb40,#2563eb0d);width:2px;position:absolute;top:44px;bottom:4px;left:21px}.tutorial-step:last-child:before{display:none}.tutorial-step-icon{background:linear-gradient(135deg, var(--navy), var(--blue));width:44px;height:44px;color:var(--white);z-index:1;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;display:flex}.tutorial-step-icon svg{width:20px;height:20px}.tutorial-step-body{padding-top:4px}.tutorial-step-number{letter-spacing:.06em;text-transform:uppercase;color:var(--accent);margin-bottom:2px;font-size:11px;font-weight:700;display:block}.tutorial-step-body h3{color:var(--navy);margin-bottom:4px;font-size:17px;font-weight:700}.tutorial-step-body p{color:var(--text-secondary);max-width:440px;font-size:14px;line-height:1.55}.tutorial-footer{border-top:1px solid #e7eaf0;justify-content:flex-end;align-items:center;gap:12px;margin-top:20px;padding-top:24px;display:flex}.tutorial-primary,.tutorial-secondary{border-radius:var(--border-radius);font-size:14px;font-weight:600;width:auto!important;padding:12px 24px!important}.tutorial-primary{transition:opacity .2s;background-color:var(--accent)!important;color:var(--navy)!important}.tutorial-primary:hover{opacity:.85;background-color:var(--accent)!important}.tutorial-secondary{color:var(--text-secondary)!important;background:0 0!important}.tutorial-secondary:hover{color:var(--navy)!important;background:0 0!important}@keyframes tutorial-fade-in{0%{opacity:0}to{opacity:1}}@keyframes tutorial-rise-in{0%{opacity:0;transform:translateY(12px)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}@media (width<=560px){.tutorial-modal{padding:36px 24px 24px}.tutorial-title{font-size:24px}.tutorial-footer{flex-direction:column-reverse;align-items:stretch}.tutorial-primary,.tutorial-secondary{text-align:center;width:100%!important}}.survey-modal{border-radius:var(--border-radius-lg);background-color:#1a2a4a;border:1px solid #ffffff1f;flex-direction:column;gap:20px;width:100%;max-width:480px;max-height:85vh;padding:40px;display:flex;position:relative;overflow-y:auto;box-shadow:0 10px 40px #00000080}.survey-modal::-webkit-scrollbar{width:6px}.survey-modal::-webkit-scrollbar-track{background:#ffffff08}.survey-modal::-webkit-scrollbar-thumb{background-color:#ffffff26;border-radius:10px}.survey-progress{gap:6px;padding-right:24px;display:flex}.survey-dot{background-color:#ffffff1f;border-radius:4px;flex:1;height:4px;transition:background-color .2s}.survey-dot.done{background-color:#f59e0b80}.survey-dot.active{background-color:var(--accent)}.survey-step-count{letter-spacing:.04em;text-transform:uppercase;color:#fff6;margin-top:-8px;font-size:12px;font-weight:600}.survey-question{color:var(--white);font-size:19px;font-weight:700;line-height:1.4}.survey-optional-tag{text-transform:uppercase;letter-spacing:.04em;color:#ffffff80;vertical-align:middle;background-color:#ffffff14;border-radius:999px;margin-left:10px;padding:3px 10px;font-size:11px;font-weight:600;display:inline-block}.survey-scale{flex-direction:column;gap:10px;display:flex}.survey-scale-row{gap:10px;display:flex}.survey-scale-btn{aspect-ratio:1;border-radius:var(--border-radius);color:var(--white);background-color:#ffffff0d;border:1px solid #ffffff26;flex:1;justify-content:center;align-items:center;font-size:16px;font-weight:700;transition:all .2s;display:flex}.survey-scale-btn:hover{background-color:#ffffff14;border-color:#ffffff4d}.survey-scale-btn.selected{background-color:var(--accent);border-color:var(--accent);color:var(--navy)}.survey-scale-labels{color:#ffffff80;justify-content:space-between;font-size:12px;display:flex}.survey-choices{flex-direction:column;gap:10px;display:flex}.survey-choice-btn{color:var(--white);border-radius:var(--border-radius);text-align:left;background-color:#ffffff0d;border:1px solid #ffffff26;padding:14px 16px;font-size:14px;font-weight:500;transition:all .2s}.survey-choice-btn:hover{background-color:#ffffff14;border-color:#ffffff4d}.survey-choice-btn.selected{border-color:var(--accent);color:var(--accent);background-color:#f59e0b26;font-weight:700}.survey-textarea{border-radius:var(--border-radius);width:100%;color:var(--white);resize:vertical;background-color:#ffffff0d;border:1px solid #ffffff26;outline:none;padding:14px 16px;font-family:inherit;font-size:14px;line-height:1.6;transition:border-color .2s}.survey-textarea::placeholder{color:#ffffff59}.survey-textarea:focus{border-color:var(--accent)}.survey-nav{gap:12px;margin-top:4px;display:flex}.survey-back-btn{border-radius:var(--border-radius);color:#ffffffb3;background-color:#0000;border:1px solid #ffffff26;flex:none;padding:12px 20px;font-size:14px;font-weight:600;transition:all .2s}.survey-back-btn:hover:not(:disabled){color:var(--white);background-color:#ffffff0f}.survey-back-btn:disabled{opacity:.3;cursor:default}.survey-primary-btn{border-radius:var(--border-radius);background-color:var(--accent);color:var(--navy);flex:1;padding:12px 20px;font-size:14px;font-weight:700;transition:opacity .2s}.survey-primary-btn:hover:not(:disabled){opacity:.85}.survey-primary-btn:disabled{opacity:.4;cursor:default}.survey-done{text-align:center;flex-direction:column;align-items:center;gap:12px;padding:16px 0 8px;display:flex}.survey-done-icon{border:1px solid var(--success);width:56px;height:56px;color:var(--success);background-color:#22c55e26;border-radius:50%;justify-content:center;align-items:center;margin-bottom:4px;font-size:26px;font-weight:700;display:flex}.survey-done h2{color:var(--white);font-size:20px;font-weight:700}.survey-done p{color:#fff9;margin-bottom:8px;font-size:14px;line-height:1.6}.survey-reward{background-color:#f59e0b1f;border:1px solid #f59e0b59;border-radius:999px;align-items:center;gap:6px;padding:8px 18px;font-weight:700;display:flex;color:var(--accent)!important;font-size:15px!important}.survey-reward .token-icon{width:18px;height:18px}.survey-done .survey-primary-btn{width:100%}@media (width<=480px){.survey-modal{max-width:92%;padding:28px 20px}.survey-scale-btn{font-size:14px}}.toast{border-radius:var(--border-radius);z-index:2000;align-items:center;gap:16px;padding:16px 20px;font-size:14px;font-weight:500;animation:.3s slideIn;display:flex;position:fixed;top:100px;right:40px;box-shadow:0 4px 12px #0000004d}@keyframes slideIn{0%{opacity:0;transform:translate(400px)}to{opacity:1;transform:translate(0)}}.toast-error{background-color:var(--error);color:var(--white)}.toast-success{background-color:var(--success);color:var(--white)}.toast-close{color:var(--white);cursor:pointer;opacity:.8;background:0 0;width:auto;padding:0;font-size:20px}.toast-close:hover{opacity:1}.cookie-banner{background-color:var(--navy);width:100%;color:var(--white);z-index:1100;position:fixed;bottom:0;left:0;box-shadow:0 -2px 12px #00000040}.cookie-banner-content{flex-direction:column;gap:16px;max-width:1000px;margin:0 auto;padding:20px 24px;display:flex}.cookie-banner-content p{color:#ffffffd9;font-size:14px;line-height:1.6}.cookie-banner-content a{color:var(--accent);text-decoration:underline}.cookie-categories{border-top:1px solid #ffffff26;border-bottom:1px solid #ffffff26;flex-direction:column;gap:12px;padding:12px 0;display:flex}.cookie-category label{cursor:pointer;align-items:center;gap:8px;font-size:14px;font-weight:600;display:flex}.cookie-category input[type=checkbox]{width:16px;height:16px;accent-color:var(--accent);cursor:pointer}.cookie-category p{color:#fff9;margin-left:24px;font-size:13px}.cookie-banner-actions{flex-wrap:wrap;justify-content:flex-end;gap:12px;display:flex}.cookie-btn{border-radius:var(--border-radius);padding:10px 20px;font-size:14px;font-weight:600;transition:background-color .2s,color .2s}.cookie-btn-primary{background-color:var(--accent);color:var(--navy)}.cookie-btn-primary:hover{opacity:.9}.cookie-btn-secondary{color:var(--white);background-color:#0000;border:1px solid #ffffff4d}.cookie-btn-secondary:hover{background-color:#ffffff1a}@media (width<=600px){.cookie-banner-actions{flex-direction:column}.cookie-btn{width:100%}}