@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600&family=Outfit:wght@400;600;800&family=Fira+Code:wght@400;500&display=swap";:root{--bg-dark:#0f1016;--bg-darker:#050608;--text-main:#f8fafc;--text-muted:#94a3b8;--primary:#3b82f6;--primary-hover:#2563eb;--accent:#8b5cf6;--glass-bg:#ffffff08;--glass-border:#ffffff14;--glass-shadow:0 8px 32px 0 #0006}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-dark);color:var(--text-main);scroll-behavior:smooth;min-height:100vh;font-family:Inter,sans-serif;overflow-x:hidden}.gradient-bg{z-index:-1;background:var(--bg-dark);width:100vw;height:100vh;position:fixed;top:0;left:0}.text-animated-gradient{background:linear-gradient(90deg,#3b82f6,#8b5cf6,#3b82f6) 0 0/200%;-webkit-text-fill-color:transparent;-webkit-background-clip:text;animation:3s linear infinite textGradientFlow;display:inline-block}@keyframes textGradientFlow{0%{background-position:0%}to{background-position:200%}}h1,h2,h3,h4{letter-spacing:-.01em;font-family:Outfit,sans-serif;font-weight:600}button{cursor:pointer;border:none;outline:none;font-family:Inter,sans-serif}::-webkit-scrollbar{background:0 0;width:0}.app-container{min-height:100vh;display:flex;position:relative}.dance-overlay{z-index:9999;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);pointer-events:none;background:#0a0a14d1;justify-content:center;align-items:center;animation:3.2s forwards overlayFade;display:flex;position:fixed;inset:0}.dance-runner{filter:drop-shadow(0 0 30px #8b5cf6cc);width:160px;height:160px;animation:3.2s forwards danceSequence}@keyframes overlayFade{0%{opacity:0}5%{opacity:1}85%{opacity:1}to{opacity:0}}@keyframes danceSequence{0%{opacity:0;transform:translate(-50vw)scale(.5)}8%{opacity:1}22%{opacity:1;transform:translate(0)scale(2.5)}30%{transform:translate(0)scale(2.5)rotate(-12deg)}38%{transform:translate(0)scale(2.5)rotate(12deg)}46%{transform:translate(0)scale(2.5)rotate(-10deg)}54%{transform:translate(0)scale(2.5)rotate(10deg)}60%{transform:translate(0)scale(2.5)rotate(-5deg)}66%{transform:translate(0)scale(2.5)rotate(0)}74%{transform:translate(0)scale(2.8)translateY(-25px)}82%{transform:translate(0)scale(2.5)translateY(0)}to{opacity:0;transform:translate(0)scale(0)}}.confirm-overlay{z-index:9998;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#0a0a14bf;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.confirm-dialog{background:#141423f2;border:1px solid #ffffff1f;border-radius:20px;width:calc(100% - 48px);max-width:520px;padding:32px;box-shadow:0 20px 60px #00000080}.sidebar{z-index:100;-webkit-backdrop-filter:blur(12px);background:#0f101666;border-right:1px solid #ffffff0d;flex-direction:column;justify-content:center;align-items:center;width:80px;height:100vh;display:flex;position:fixed;top:0;left:0}.nav-dots{flex-direction:column;gap:40px;display:flex;position:relative}.nav-line{z-index:-1;background:#ffffff0d;width:2px;position:absolute;top:0;bottom:0;left:50%;transform:translate(-50%)}.nav-line-active{z-index:0;background:linear-gradient(#8b5cf6,#3b82f6);width:2px;transition:height .4s cubic-bezier(.25,1,.5,1);position:absolute;top:0;left:50%;transform:translate(-50%)}.nav-dot{cursor:pointer;z-index:1;background:#1e293b;border:2px solid #ffffff1a;border-radius:50%;width:14px;height:14px;transition:all .4s cubic-bezier(.25,1,.5,1)}.nav-dot.active{background:#3b82f6;border-color:#fff;transform:scale(1.4);box-shadow:0 0 15px #3b82f699}.runner-tracker{z-index:5;pointer-events:none;filter:drop-shadow(0 2px 5px #00000080);width:45px;height:45px;transition:top .4s cubic-bezier(.25,1,.5,1);position:absolute;left:calc(50% + 20px);transform:translateY(-50%)}.top-header{z-index:50;pointer-events:none;justify-content:space-between;align-items:center;padding:30px 50px;display:flex;position:fixed;top:0;left:80px;right:0}.logo{pointer-events:auto;align-items:center;gap:12px;display:flex}.logo img{height:38px}.logo-text{letter-spacing:1px;color:#fff;font-family:Outfit;font-size:26px;font-weight:800}.h-scroll-track{height:100%;transition:transform .5s cubic-bezier(.25,1,.5,1);display:flex}.h-slide{flex-direction:column;flex:0 0 50%;justify-content:center;align-items:center;width:50%;height:100vh;padding:80px 40px;display:flex;overflow:hidden auto}.h-dots{z-index:30;gap:10px;display:flex;position:absolute;bottom:24px;left:50%;transform:translate(-50%)}.h-dot{cursor:pointer;background:#ffffff26;border-radius:50%;width:10px;height:10px;transition:all .3s}.h-dot.active{background:#3b82f6;transform:scale(1.3);box-shadow:0 0 10px #3b82f680}.h-nav-btn{color:#fff;cursor:pointer;z-index:30;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#ffffff14;border:1px solid #ffffff26;border-radius:50%;justify-content:center;align-items:center;width:44px;height:44px;transition:all .3s;display:flex;position:absolute;top:50%;transform:translateY(-50%)}.h-nav-btn:hover{background:#ffffff26;border-color:#ffffff4d}.h-nav-left{left:16px}.h-nav-right{right:16px}.url-input{color:#fff;background:#ffffff0d;border:1px solid #ffffff26;border-radius:12px;outline:none;width:100%;padding:16px 20px;font-family:Fira Code,monospace;font-size:16px;transition:all .3s}.url-input:focus{border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f626}.url-input::placeholder{color:#ffffff4d}.main-scroll-area{scroll-snap-type:y mandatory;flex-direction:column;flex:1;height:100vh;margin-left:80px;display:flex;overflow-y:scroll}.section{scroll-snap-align:start;scroll-snap-stop:always;flex-direction:column;justify-content:center;align-items:center;min-height:100vh;padding:80px 40px;display:flex;position:relative}.content-wrapper{z-index:10;width:100%;max-width:800px;padding-bottom:60px}.down-arrow-container{opacity:.6;cursor:pointer;z-index:20;flex-direction:column;align-items:center;gap:8px;transition:opacity .3s;display:flex;position:absolute;bottom:20px;left:50%;transform:translate(-50%)}.down-arrow-container:hover{opacity:1}.down-arrow{animation:2s infinite bounce}@keyframes bounce{0%,20%,50%,80%,to{transform:translateY(0)}40%{transform:translateY(-10px)}60%{transform:translateY(-5px)}}.scan-line{opacity:.6;pointer-events:none;z-index:5;background:linear-gradient(90deg,#0000,#3b82f6,#8b5cf6,#0000);width:60%;height:1px;position:absolute}.scan-line-top{animation:4s ease-in-out infinite scanLTR;top:15%;left:-60%}.scan-line-bottom{animation:4s ease-in-out 2s infinite scanRTL;bottom:15%;right:-60%}@keyframes scanLTR{0%{opacity:0;left:-60%}10%{opacity:.6}90%{opacity:.6}to{opacity:0;left:110%}}@keyframes scanRTL{0%{opacity:0;right:-60%}10%{opacity:.6}90%{opacity:.6}to{opacity:0;right:110%}}.scroll-reveal-text{background:linear-gradient(90deg,#fff 50%,#ffffff1a 50%) 100% 0/200% 100%;-webkit-text-fill-color:transparent;-webkit-background-clip:text;margin-bottom:24px;font-size:64px;font-weight:800;line-height:1.1;transition:background-position 1s cubic-bezier(.16,1,.3,1)}.scroll-reveal-text.in-view{background-position:0 0}.section-title{color:#fff;margin-bottom:24px;font-size:48px;font-weight:800}.title-gradient{background:linear-gradient(90deg,#8b5cf6,#3b82f6);-webkit-text-fill-color:transparent;-webkit-background-clip:text}.text-lg{color:var(--text-muted);margin-bottom:32px;font-size:20px;font-weight:300;line-height:1.7}.glass-panel{-webkit-backdrop-filter:blur(20px);background:#ffffff05;border:1px solid #ffffff0d;border-radius:20px;padding:40px;box-shadow:0 10px 40px #0003}.btn-primary{color:#fff;background:linear-gradient(135deg,#4f46e5,#3b82f6);border:none;border-radius:100px;align-items:center;gap:12px;padding:16px 32px;font-size:16px;font-weight:500;transition:all .3s;display:inline-flex;position:relative;overflow:hidden;box-shadow:0 4px 15px #3b82f64d}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 8px 25px #3b82f666}.btn-primary:active{transform:translateY(0)}.btn-done{cursor:not-allowed;color:#fff6!important;box-shadow:none!important;background:#ffffff1a!important;transform:none!important}.btn-error{color:#fca5a5!important;box-shadow:none!important;background:#ef444433!important;border:1px solid #ef444466!important}.btn-secondary{color:#fff;background:#ffffff0d;border:1px solid #ffffff1a;border-radius:100px;padding:12px 24px;font-size:14px;font-weight:500;transition:all .3s}.btn-secondary:hover{background:#ffffff1a;border-color:#fff3}.upload-zone{text-align:center;cursor:pointer;background:#ffffff03;border:2px dashed #fff3;border-radius:20px;padding:80px 40px;transition:all .3s;position:relative;overflow:hidden}.upload-zone:hover,.upload-zone.drag-active{border-color:var(--primary);background:#3b82f60d}.upload-icon-wrapper{color:#fff;background:#ffffff0d;border-radius:50%;justify-content:center;align-items:center;width:80px;height:80px;margin:0 auto 24px;transition:all .4s cubic-bezier(.175,.885,.32,1.275);display:flex}.upload-zone:hover .upload-icon-wrapper{background:linear-gradient(135deg,#4f46e5,#3b82f6);transform:scale(1.1)translateY(-10px);box-shadow:0 10px 20px #3b82f64d}.custom-scrollbar::-webkit-scrollbar{width:6px}.custom-scrollbar::-webkit-scrollbar-track{background:#ffffff05;border-radius:10px}.custom-scrollbar::-webkit-scrollbar-thumb{background:#ffffff26;border-radius:10px}.custom-scrollbar::-webkit-scrollbar-thumb:hover{background:#ffffff4d}.card-perspective{perspective:1000px;width:100%;max-width:500px;margin:0 auto}.id-card{-webkit-backdrop-filter:blur(20px);background:linear-gradient(135deg,#ffffff1a 0%,#ffffff03 100%);border:1px solid #ffffff26;border-radius:24px;width:100%;padding:40px;position:relative;overflow:hidden;box-shadow:0 20px 50px #00000080,inset 0 1px #ffffff4d}.id-card:before{content:"";pointer-events:none;opacity:0;background:radial-gradient(circle,#ffffff1a 0%,#0000 50%);width:200%;height:200%;transition:opacity .3s;position:absolute;top:-50%;left:-50%}.card-perspective:hover .id-card:before{opacity:1}
