.auth-bg{background:radial-gradient(ellipse 80% 50% at 50% -20%,rgba(120,119,198,.15),transparent),#09090b}.auth-card{background:#18181bcc;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.08);box-shadow:0 0 0 1px #ffffff0d,0 20px 50px -12px #00000080}.auth-card:hover{border-color:#ffffff1f}.auth-input{background:#09090bcc;border:1px solid rgba(255,255,255,.1);transition:all .2s ease}.auth-input:focus{border-color:#ffffff40;box-shadow:0 0 0 3px #ffffff0d;outline:none}.auth-input::-moz-placeholder{color:#52525b}.auth-input::placeholder{color:#52525b}.btn-google{background:#ffffff08;border:1px solid rgba(255,255,255,.1);transition:all .2s ease}.btn-google:hover{background:#ffffff14;border-color:#fff3}.btn-microsoft{background:#ffffff08;border:1px solid rgba(255,255,255,.1);transition:all .2s ease}.btn-microsoft:hover{background:#ffffff14;border-color:#fff3}.btn-primary{background:#fafafa;color:#09090b;font-weight:600;transition:all .2s ease}.btn-primary:hover{background:#e4e4e7;transform:translateY(-1px)}.divider-line{background:linear-gradient(90deg,transparent,rgba(255,255,255,.1),transparent);height:1px}.hero-gmail-container{--bg-color: #09090b;--sidebar-bg: #18181b;--list-bg: #09090b;--item-hover: #27272a;--text-main: #fafafa;--text-muted: #71717a;--divider: #27272a;width:100%;max-width:1000px;margin:0 auto;transform:translateZ(0);overflow:visible;position:relative}.gmail-interface-wrapper{position:relative;border-radius:16px;animation:border-glow 5s linear infinite;box-shadow:0 0 0 1px #ffffff0f,0 25px 50px -12px #00000080,0 0 100px -20px #ffffff0d}.gmail-interface{display:grid;grid-template-columns:180px 1fr;height:600px;background:linear-gradient(145deg,#0e0e11 0%,var(--bg-color) 50%,#0a0a0d 100%);border-radius:16px;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;overflow:hidden;position:relative;box-shadow:inset 0 1px #ffffff08}.gmail-sidebar{background:linear-gradient(180deg,#1c1c20 0%,var(--sidebar-bg) 30%,#141417 100%);padding:20px 12px;display:flex;flex-direction:column;gap:6px;overflow:hidden;border-right:1px solid rgba(255,255,255,.04)}@keyframes border-glow{0%,14%{box-shadow:0 0 0 1px #ffffff0f,0 25px 50px -12px #00000080,0 0 100px -20px #ffffff0d}18%,26%{box-shadow:0 0 0 1px #22c55e59,0 0 50px -5px #22c55e26,0 25px 50px -12px #00000080,0 0 100px -20px #22c55e14}34%,to{box-shadow:0 0 0 1px #ffffff0f,0 25px 50px -12px #00000080,0 0 100px -20px #ffffff0d}}.compose-btn{background:#fff;color:#09090b;height:40px;width:100%;border-radius:6px;display:flex;align-items:center;justify-content:center;font-weight:500;font-size:14px;margin-bottom:20px;text-decoration:none;transition:background-color .15s ease;cursor:pointer}.compose-btn:hover{background:#e4e4e7}.nav-item{padding:10px 12px;border-radius:6px;color:var(--text-muted);font-size:14px;display:flex;justify-content:space-between}.nav-item.active{background:#ffffff0d;color:var(--text-main);font-weight:500;border-radius:6px;border:1px solid rgba(255,255,255,.08);animation:inbox-pulse 5s ease infinite}@keyframes inbox-pulse{0%,16%{border-color:#ffffff14;box-shadow:none}20%,28%{border-color:#22c55e99;box-shadow:0 0 20px #22c55e40,inset 0 0 12px #22c55e14}34%,to{border-color:#ffffff14;box-shadow:none}}.nav-item-label{margin-top:20px;margin-bottom:6px;color:var(--text-muted);font-size:11px;text-transform:uppercase;letter-spacing:.05em}.nav-item-label-tag{display:flex;align-items:center;justify-content:space-between;padding:8px 10px;border-radius:6px;font-size:11px;color:var(--text-main);background:#ffffff0d;border:1px solid rgba(255,255,255,.08);animation:label-pulse 5s ease infinite;gap:12px}.label-tag-left{display:flex;align-items:center;gap:6px}.label-count{font-size:10px;color:var(--text-muted);background:#ffffff1a;padding:2px 6px;border-radius:4px;font-weight:500;position:relative}.inbox-count,.outsiders-count{position:relative;min-width:14px;text-align:center}.count-num{position:absolute;left:0;right:0;opacity:0}.count-0{animation:inbox-count-0 5s ease infinite}.count-1{animation:inbox-count-1 5s ease infinite}.count-2{animation:inbox-count-2 5s ease infinite}.count-3{animation:inbox-count-3 5s ease infinite}.count-4{animation:inbox-count-4 5s ease infinite}@keyframes inbox-count-0{0%,20%{opacity:1}21%,to{opacity:0}}@keyframes inbox-count-1{0%,20%{opacity:0}21%,22%{opacity:1}23%,to{opacity:0}}@keyframes inbox-count-2{0%,22%{opacity:0}23%,24%{opacity:1}25%,to{opacity:0}}@keyframes inbox-count-3{0%,24%{opacity:0}25%,26%{opacity:1}27%,to{opacity:0}}@keyframes inbox-count-4{0%,26%{opacity:0}27%,90%{opacity:1}95%,to{opacity:0}}.out-count-0{animation:out-count-0 5s ease infinite}.out-count-1{animation:out-count-1 5s ease infinite}.out-count-2{animation:out-count-2 5s ease infinite}.out-count-3{animation:out-count-3 5s ease infinite}.out-count-4{animation:out-count-4 5s ease infinite}@keyframes out-count-0{0%,20.5%{opacity:1}21.5%,to{opacity:0}}@keyframes out-count-1{0%,20.5%{opacity:0}21.5%,22.5%{opacity:1}23.5%,to{opacity:0}}@keyframes out-count-2{0%,22.5%{opacity:0}23.5%,24.5%{opacity:1}25.5%,to{opacity:0}}@keyframes out-count-3{0%,24.5%{opacity:0}25.5%,26.5%{opacity:1}27.5%,to{opacity:0}}@keyframes out-count-4{0%,26.5%{opacity:0}27.5%,90%{opacity:1}95%,to{opacity:0}}@keyframes label-pulse{0%,16%{border-color:#ffffff14;box-shadow:none}20%,28%{border-color:#fff6;box-shadow:0 0 16px #ffffff26,inset 0 0 12px #ffffff0d}34%,to{border-color:#ffffff14;box-shadow:none}}.label-indicator{width:8px;height:8px;background:#fff;border-radius:2px;flex-shrink:0;animation:indicator-glow 5s ease infinite}@keyframes indicator-glow{0%,16%{box-shadow:none}20%,28%{box-shadow:0 0 8px #fffc}34%,to{box-shadow:none}}.email-list-container{display:flex;flex-direction:column;background:var(--list-bg);overflow:hidden;border-right:1px solid var(--divider)}.top-bar{height:56px;border-bottom:1px solid var(--divider);display:flex;align-items:center;padding:0 16px}.search-fake{background:var(--sidebar-bg);width:100%;height:40px;border-radius:6px;display:flex;align-items:center;padding-left:16px;color:var(--text-muted);font-size:14px;border:1px solid var(--divider)}.list-section{padding:12px;display:flex;flex-direction:column;gap:3px}.section-header{color:var(--text-main);font-size:11px;font-weight:500;text-transform:uppercase;letter-spacing:.05em;margin:8px 0 6px 10px;padding-bottom:6px}.section-header.outsider{margin-top:20px}.email-row{height:44px;background:transparent;border-bottom:1px solid var(--divider);display:flex;align-items:center;padding:0 12px;color:var(--text-muted);font-size:13px;border-radius:4px}.email-row .check{width:16px;height:16px;border:1px solid var(--text-muted);border-radius:3px;margin-right:12px;flex-shrink:0}.email-row .star{margin-right:12px;color:var(--text-muted);font-size:16px}.email-row .sender{width:100px;font-weight:500;color:var(--text-main);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex-shrink:0}.email-row .subject{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-left:12px}.email-row .date{font-size:11px;margin-left:10px;flex-shrink:0}.envelope-container{position:absolute;right:-80px;top:0;bottom:0;width:120px;z-index:30;overflow:visible;pointer-events:none}.envelope{position:absolute;width:55px;height:38px;border-radius:4px;opacity:0;right:0;top:50%;transform:translateY(-50%);box-shadow:0 4px 12px #0000004d}.envelope:before{content:"";position:absolute;top:0;left:0;border-left:27px solid transparent;border-right:28px solid transparent;border-top:18px solid rgba(0,0,0,.15)}.envelope[style*="--i: 0"]{--pos-x: -45px;--pos-y: -50px}.envelope[style*="--i: 1"]{--pos-x: 0px;--pos-y: -55px}.envelope[style*="--i: 2"]{--pos-x: 45px;--pos-y: -48px}.envelope[style*="--i: 3"]{--pos-x: -40px;--pos-y: 0px}.envelope[style*="--i: 4"]{--pos-x: 5px;--pos-y: 5px}.envelope[style*="--i: 5"]{--pos-x: 45px;--pos-y: -3px}.envelope[style*="--i: 6"]{--pos-x: -20px;--pos-y: 50px}.envelope[style*="--i: 7"]{--pos-x: 25px;--pos-y: 55px}.envelope[style*="--i: 0"]{animation-delay:0s}.envelope[style*="--i: 1"]{animation-delay:.04s}.envelope[style*="--i: 2"]{animation-delay:.08s}.envelope[style*="--i: 3"]{animation-delay:.12s}.envelope[style*="--i: 4"]{animation-delay:.16s}.envelope[style*="--i: 5"]{animation-delay:.2s}.envelope[style*="--i: 6"]{animation-delay:.24s}.envelope[style*="--i: 7"]{animation-delay:.28s}.env-inbox{background:linear-gradient(135deg,#f0fdf4,#dcfce7);border:1px solid rgba(34,197,94,.3);animation:fly-to-inbox 5s ease-out infinite}.env-inbox:before{border-top-color:#22c55e33}.env-outsider{background:linear-gradient(135deg,#3f3f46,#27272a);border:1px solid rgba(255,255,255,.15);animation:fly-to-outsiders 5s ease-out infinite}.env-outsider:before{border-top-color:#ffffff1a}@keyframes fly-to-inbox{0%{opacity:0;transform:translateY(calc(-50% + var(--pos-y))) translate(calc(350px + var(--pos-x)))}5%{opacity:1;transform:translateY(calc(-50% + var(--pos-y))) translate(calc(220px + var(--pos-x)))}12%{opacity:1;transform:translateY(calc(-50% + var(--pos-y) * .5)) translate(calc(40px + var(--pos-x) * .3))}17%{opacity:1;transform:translateY(calc(-50% - 90px)) translate(-120px) scale(.6)}21%{opacity:.5;transform:translateY(calc(-50% - 130px)) translate(-200px) scale(.35)}24%{opacity:0;transform:translateY(calc(-50% - 145px)) translate(-230px) scale(.25)}to{opacity:0}}@keyframes fly-to-outsiders{0%{opacity:0;transform:translateY(calc(-50% + var(--pos-y))) translate(calc(350px + var(--pos-x)))}5%{opacity:1;transform:translateY(calc(-50% + var(--pos-y))) translate(calc(220px + var(--pos-x)))}12%{opacity:1;transform:translateY(calc(-50% + var(--pos-y) * .5)) translate(calc(40px + var(--pos-x) * .3))}17%{opacity:1;transform:translateY(calc(-50% + 70px)) translate(-120px) scale(.6)}21%{opacity:.5;transform:translateY(calc(-50% + 110px)) translate(-200px) scale(.35)}24%{opacity:0;transform:translateY(calc(-50% + 125px)) translate(-230px) scale(.25)}to{opacity:0}}.cascade-header,.cascade-header-outsider{opacity:0;transform:translate(-10px)}.cascade-header{animation:cascade-header-in 5s ease-in-out infinite}.cascade-header-outsider{animation:cascade-header-outsider-in 5s ease-in-out infinite}@keyframes cascade-header-in{0%,18%{opacity:0;transform:translate(-10px)}22%,88%{opacity:1;transform:translate(0)}95%,to{opacity:0;transform:translate(-10px)}}@keyframes cascade-header-outsider-in{0%,19%{opacity:0;transform:translate(-10px)}23%,88%{opacity:1;transform:translate(0)}95%,to{opacity:0;transform:translate(-10px)}}.cascade-inbox{opacity:0;transform:translate(-20px);animation:cascade-inbox-in 5s ease-out infinite;animation-delay:calc((var(--delay) - 1) * .08s)}@keyframes cascade-inbox-in{0%,18%{opacity:0;transform:translate(-20px);background:transparent;border-left:2px solid transparent}22%{opacity:1;transform:translate(0);background:#22c55e2e;border-left:2px solid rgba(34,197,94,.8)}30%,88%{opacity:1;transform:translate(0);background:transparent;border-left:2px solid transparent}95%,to{opacity:0;transform:translate(-20px);background:transparent;border-left:2px solid transparent}}.cascade-outsider{opacity:0;transform:translate(-20px);animation:cascade-outsider-in 5s ease-out infinite;animation-delay:calc(.04s + (var(--delay) - 1) * .08s)}@keyframes cascade-outsider-in{0%,18%{opacity:0;transform:translate(-20px);background:transparent;border-left:2px solid transparent}22%{opacity:1;transform:translate(0);background:#ffffff1a;border-left:2px solid rgba(255,255,255,.5)}30%,88%{opacity:1;transform:translate(0);background:transparent;border-left:2px solid transparent}95%,to{opacity:0;transform:translate(-20px);background:transparent;border-left:2px solid transparent}}.inbox-section{position:relative}.inbox-section:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:transparent;border-radius:8px;pointer-events:none;animation:inbox-section-glow 5s ease-in-out infinite}@keyframes inbox-section-glow{0%,16%{background:transparent}20%,26%{background:#22c55e08}32%,to{background:transparent}}.outsiders-section{position:relative}.outsiders-section:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:transparent;border-radius:8px;pointer-events:none;animation:outsiders-section-glow 5s ease-in-out infinite}@keyframes outsiders-section-glow{0%,16%{background:transparent}20%,26%{background:#ffffff05}32%,to{background:transparent}}@media(prefers-reduced-motion:reduce){.gmail-interface-wrapper,.nav-item.active,.nav-item-label-tag,.label-indicator,.cascade-header,.cascade-header-outsider,.cascade-inbox,.cascade-outsider,.inbox-section:before,.outsiders-section:before,.envelope{animation:none}.gmail-interface-wrapper{box-shadow:0 0 0 1px #ffffff1a}.cascade-header,.cascade-header-outsider,.cascade-inbox,.cascade-outsider{opacity:1;transform:none}.envelope{display:none}}@media(max-width:768px){.hero-gmail-container{padding-right:0;max-width:400px;margin-left:auto;margin-right:auto}.gmail-interface{grid-template-columns:1fr;grid-template-rows:1fr;height:580px;min-height:580px;background:linear-gradient(180deg,#0e0e11 0%,var(--bg-color) 100%)}.gmail-sidebar{display:none}.email-list-container{border:none;border-radius:16px;height:100%;min-height:580px;overflow:hidden}.gmail-interface-wrapper{border-radius:16px;overflow:visible;position:relative}.envelope-container{position:absolute;left:50%;transform:translate(-50%);top:-70px;bottom:auto;right:auto;width:200px;height:70px;display:flex;justify-content:center}.envelope{width:40px;height:28px;top:0;right:auto;left:50%;transform:translate(-50%)}.envelope:before{border-left:20px solid transparent;border-right:20px solid transparent;border-top:14px solid rgba(0,0,0,.15)}.envelope[style*="--i: 0"]{--mob-x: -40px;--mob-y: -40px}.envelope[style*="--i: 1"]{--mob-x: 0px;--mob-y: -45px}.envelope[style*="--i: 2"]{--mob-x: 40px;--mob-y: -38px}.envelope[style*="--i: 3"]{--mob-x: -35px;--mob-y: 0px}.envelope[style*="--i: 4"]{--mob-x: 5px;--mob-y: 5px}.envelope[style*="--i: 5"]{--mob-x: 40px;--mob-y: -2px}.envelope[style*="--i: 6"]{--mob-x: -18px;--mob-y: 40px}.envelope[style*="--i: 7"]{--mob-x: 22px;--mob-y: 45px}.envelope[style*="--i: 0"]{animation-delay:0s}.envelope[style*="--i: 1"]{animation-delay:.04s}.envelope[style*="--i: 2"]{animation-delay:.08s}.envelope[style*="--i: 3"]{animation-delay:.12s}.envelope[style*="--i: 4"]{animation-delay:.16s}.envelope[style*="--i: 5"]{animation-delay:.2s}.envelope[style*="--i: 6"]{animation-delay:.24s}.envelope[style*="--i: 7"]{animation-delay:.28s}.env-inbox{animation:fly-to-inbox-mobile 5s ease-out infinite}.env-outsider{animation:fly-to-outsiders-mobile 5s ease-out infinite}@keyframes fly-to-inbox-mobile{0%{opacity:0;transform:translate(calc(-50% + var(--mob-x))) translateY(calc(-140px + var(--mob-y)))}5%{opacity:1;transform:translate(calc(-50% + var(--mob-x))) translateY(calc(-90px + var(--mob-y)))}12%{opacity:1;transform:translate(calc(-50% + var(--mob-x) * .5)) translateY(calc(-20px + var(--mob-y) * .3))}17%{opacity:1;transform:translate(calc(-50% - 50px)) translateY(70px) scale(.7)}21%{opacity:.6;transform:translate(calc(-50% - 70px)) translateY(100px) scale(.45)}24%{opacity:0;transform:translate(calc(-50% - 85px)) translateY(120px) scale(.3)}to{opacity:0}}@keyframes fly-to-outsiders-mobile{0%{opacity:0;transform:translate(calc(-50% + var(--mob-x))) translateY(calc(-140px + var(--mob-y)))}5%{opacity:1;transform:translate(calc(-50% + var(--mob-x))) translateY(calc(-90px + var(--mob-y)))}12%{opacity:1;transform:translate(calc(-50% + var(--mob-x) * .5)) translateY(calc(-20px + var(--mob-y) * .3))}17%{opacity:1;transform:translate(calc(-50% + 50px)) translateY(240px) scale(.7)}21%{opacity:.6;transform:translate(calc(-50% + 70px)) translateY(280px) scale(.45)}24%{opacity:0;transform:translate(calc(-50% + 85px)) translateY(300px) scale(.3)}to{opacity:0}}}