.auth-shell{min-height:calc(100vh - 76px);padding:52px 24px;background:linear-gradient(145deg,#edf8f7,#fffaf2);display:grid;place-items:center}.auth-wrap{width:min(1120px,100%);min-height:650px;display:grid;grid-template-columns:.9fr 1.1fr;background:#fff;border:1px solid #d9e9e6;border-radius:30px;overflow:hidden;box-shadow:0 30px 80px rgba(23,107,135,.15)}.auth-story{padding:42px;position:relative;overflow:hidden;background:linear-gradient(145deg,#176b87,#218b94);color:#fff;display:flex;flex-direction:column}.auth-story:before,.auth-story:after{content:"";position:absolute;border-radius:50%;pointer-events:none}.auth-story:before{width:280px;height:280px;background:rgba(255,200,87,.18);left:-110px;top:-80px}.auth-story:after{width:190px;height:190px;border:1px solid rgba(255,255,255,.15);right:-70px;bottom:80px}.auth-brand{position:relative;color:#fff;font-size:1.15rem;font-weight:900;display:flex;align-items:center;gap:10px}.auth-brand span{width:38px;height:38px;border-radius:12px;background:#ffc857;color:#17324d;display:grid;place-items:center}.auth-story-copy{position:relative;margin:auto 0}.auth-kicker{font-size:.72rem;color:#ffc857;font-weight:800}.auth-story h1{color:#fff;font-size:clamp(2.25rem,3.5vw,3.6rem);line-height:1.3;letter-spacing:-.05em;margin:16px 0}.auth-story-copy>p{color:#dcebed;line-height:2;font-size:.88rem}.auth-benefits{display:grid;gap:12px;margin-top:28px}.auth-benefits span{padding:12px 14px;border-radius:12px;background:rgba(255,255,255,.09);font-size:.76rem}.auth-benefits i{color:#ffc857;width:24px}.auth-story-note{position:relative;display:flex;gap:10px;font-size:.7rem;color:#cde2e5}.auth-story-note i{color:#ffc857}.auth-panel{padding:45px;display:grid;place-items:center}.auth-card{width:min(430px,100%)}.auth-card.wide{width:min(570px,100%)}.auth-heading{margin-bottom:28px}.auth-icon{width:48px;height:48px;border-radius:15px;background:#e5f5f2;color:#20a39e;display:grid;place-items:center;font-size:1.15rem}.auth-heading h2{font-size:1.75rem;margin:15px 0 5px}.auth-heading p{font-size:.78rem;margin:0}.auth-alerts{display:grid;gap:8px;margin-bottom:18px}.auth-alert{display:flex;align-items:flex-start;gap:8px;padding:11px 13px;border-radius:10px;background:#fff0ed;color:#ae493d;font-size:.72rem;border:1px solid #f8cbc4}.auth-alert.success{background:#e5f6ee;color:#176c4d;border-color:#c5e9d7}.auth-form{display:grid;gap:17px}.auth-form>label,.auth-row>label{display:grid;gap:7px;font-size:.74rem;font-weight:800;color:#17324d}.auth-input{height:53px;display:flex;align-items:center;gap:9px;padding:0 14px;background:#f8fbfa;border:1.5px solid #d9e7e5;border-radius:13px;transition:.2s}.auth-input:focus-within{background:#fff;border-color:#20a39e;box-shadow:0 0 0 4px rgba(32,163,158,.11)}.auth-input>i{color:#76a5aa}.auth-input input{height:100%!important;flex:1;padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important;font-size:.8rem}.password-toggle{width:35px;height:35px;border:0!important;border-radius:9px!important;background:transparent!important;color:#789198!important;box-shadow:none!important;padding:0!important}.password-toggle:hover{background:#e5f3f1!important;transform:none!important;box-shadow:none!important}.auth-options{display:flex;justify-content:space-between;align-items:center}.auth-options>a,.auth-switch a{color:#176b87;font-size:.72rem;font-weight:800}.check-label{display:flex!important;align-items:center;gap:8px!important;font-size:.7rem!important;color:#687d87!important;cursor:pointer}.check-label input{position:absolute;opacity:0}.check-label>span{width:18px;height:18px;border:1.5px solid #b9d2cf;border-radius:5px;background:#fff}.check-label input:checked+span{background:#20a39e;border-color:#20a39e;box-shadow:inset 0 0 0 4px #fff}.check-label.terms{line-height:1.7}.auth-submit{width:100%;height:55px;border:0;border-radius:13px;background:linear-gradient(135deg,#ff7b67,#ff967c)!important;color:#fff;font-weight:900;display:flex;align-items:center;justify-content:center;gap:20px;box-shadow:0 12px 25px rgba(255,123,103,.24)!important}.auth-submit:hover{transform:translateY(-2px)}.auth-switch{display:flex;justify-content:center;gap:6px;margin-top:24px;padding-top:20px;border-top:1px solid #e4ecea;font-size:.72rem}.auth-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.password-meter{height:20px;position:relative;display:flex;align-items:center;gap:8px}.password-meter:before{content:"";width:90px;height:4px;border-radius:5px;background:#dce7e5}.password-meter i{position:absolute;right:0;width:0;height:4px;border-radius:5px;background:#ff7b67;transition:.25s}.password-meter[data-strength="1"] i{width:30px}.password-meter[data-strength="2"] i{width:60px;background:#ffc857}.password-meter[data-strength="3"] i{width:90px;background:#20a39e}.password-meter span{font-size:.58rem;color:#86949a}.register-mode .auth-wrap{grid-template-columns:1fr 1.25fr}.register-mode .auth-panel{padding:32px 42px}
@media(max-width:900px){.auth-shell{padding:28px 18px}.auth-wrap,.register-mode .auth-wrap{grid-template-columns:1fr;max-width:680px}.auth-story{min-height:280px;padding:30px}.auth-story-copy{margin:35px 0}.auth-story h1{font-size:2.3rem}.auth-benefits{grid-template-columns:repeat(3,1fr)}.auth-benefits span{display:grid;gap:6px}.auth-story-note{display:none}.auth-panel,.register-mode .auth-panel{padding:35px}.auth-card,.auth-card.wide{width:100%}}
@media(max-width:560px){.auth-shell{padding:14px 10px}.auth-wrap{border-radius:20px}.auth-story{min-height:220px;padding:22px}.auth-story h1{font-size:1.8rem}.auth-story-copy>p{font-size:.76rem}.auth-benefits{display:none}.auth-panel,.register-mode .auth-panel{padding:26px 18px}.auth-row{grid-template-columns:1fr}.auth-options{align-items:flex-start;gap:12px;flex-direction:column}.auth-heading h2{font-size:1.45rem}.auth-switch{flex-wrap:wrap}.auth-input{height:50px}}

/* Athlete-led authentication experience */
.auth-shell{
  background:#f2f4f1;
  background-image:linear-gradient(rgba(23,50,77,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(23,50,77,.035) 1px,transparent 1px);
  background-size:38px 38px;
}
.auth-wrap{min-height:680px;border-radius:8px;border-color:#d9dfdc;box-shadow:0 28px 70px rgba(17,32,43,.14)}
.auth-story{
  isolation:isolate;padding:34px 38px;justify-content:space-between;background-color:#10191d;
  background-image:radial-gradient(circle at 70% 31%,rgba(32,163,158,.22) 0 2px,transparent 3px),radial-gradient(circle at 24% 24%,rgba(255,107,74,.22) 0 2px,transparent 3px),linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
  background-size:auto,auto,32px 32px,32px 32px;
}
.auth-story::before{
  content:"";position:absolute;z-index:-1;top:74px;left:50%;width:300px;height:405px;translate:-50% 0;
  background:
    radial-gradient(ellipse at 50% 10%,#ffd0aa 0 7%,#e89067 7.4% 9%,transparent 9.5%),
    radial-gradient(ellipse at 50% 11%,#17272b 0 8%,transparent 8.5%),
    radial-gradient(ellipse at 50% 14%,#ffd0aa 0 7.5%,transparent 8%),
    radial-gradient(ellipse at 35% 33%,#19a39c 0 7%,transparent 7.5%),
    radial-gradient(ellipse at 65% 33%,#19a39c 0 7%,transparent 7.5%),
    linear-gradient(108deg,transparent 0 30%,#1b8e8b 31% 40%,transparent 41%) 15px 120px/135px 125px no-repeat,
    linear-gradient(72deg,transparent 0 59%,#ff8061 60% 69%,transparent 70%) 150px 120px/135px 125px no-repeat,
    radial-gradient(ellipse at 50% 43%,#21b3aa 0 24%,#14736f 24.5% 30%,transparent 30.5%),
    linear-gradient(82deg,transparent 0 38%,#162e33 39% 48%,transparent 49%) 72px 242px/115px 150px no-repeat,
    linear-gradient(98deg,transparent 0 51%,#162e33 52% 61%,transparent 62%) 113px 242px/115px 150px no-repeat,
    radial-gradient(ellipse at 37% 96%,#ff6b4a 0 8%,transparent 8.5%),
    radial-gradient(ellipse at 63% 96%,#20a39e 0 8%,transparent 8.5%);
  filter:drop-shadow(0 20px 22px rgba(0,0,0,.42));transform-origin:50% 85%;animation:athleteBreath 3.4s ease-in-out infinite;
}
.auth-story::after{
  content:"";position:absolute;z-index:0;top:205px;left:calc(50% - 122px);width:150px;height:34px;border:0;border-radius:0;
  background:linear-gradient(90deg,#ff6b4a 0 19%,#ff987f 19% 26%,#d7e7e2 26% 74%,#20a39e 74% 81%,#14736f 81% 100%);
  clip-path:polygon(0 14%,13% 0,22% 20%,78% 20%,87% 0,100% 14%,100% 86%,87% 100%,78% 80%,22% 80%,13% 100%,0 86%);
  box-shadow:0 12px 24px rgba(0,0,0,.35);transform-origin:100% 50%;animation:dumbbellCurl 3.4s cubic-bezier(.55,.02,.26,1) infinite;
}
.auth-brand{align-self:flex-start;text-shadow:0 2px 14px rgba(0,0,0,.5)}
.auth-brand span{border-radius:6px;background:#ff6b4a;box-shadow:0 8px 20px rgba(255,107,74,.3)}
.auth-story-copy{margin-top:auto;padding-top:315px;text-shadow:0 2px 18px rgba(0,0,0,.65)}
.auth-kicker{display:inline-flex;align-items:center;padding:6px 10px;border-right:3px solid #ff6b4a;background:rgba(9,16,19,.68);color:#82e1dc;backdrop-filter:blur(6px)}
.auth-story h1{font-size:clamp(1.85rem,2.75vw,2.85rem);line-height:1.38;letter-spacing:0;margin:13px 0 8px}
.auth-story-copy>p{margin:0;color:#d6e2e2;line-height:1.85;font-size:.78rem}
.auth-benefits{grid-template-columns:1fr 1fr;gap:8px;margin-top:16px}
.auth-benefits span{padding:9px 10px;border-radius:5px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.08);backdrop-filter:blur(7px)}
.auth-benefits span:last-child{grid-column:1/-1}
.auth-story-note{display:none}
.auth-panel{background:#fff;padding:42px}
.auth-icon,.auth-input,.auth-submit{border-radius:7px}
.auth-input{background:#f6f8f7;border-color:#dbe3df}
.auth-heading h2{letter-spacing:0}
.auth-submit{background:#ff6b4a!important;box-shadow:0 12px 26px rgba(255,107,74,.24)!important}
.auth-submit:hover{background:#ed5838!important}

@keyframes athleteBreath{0%,100%{transform:scale(1) translateY(0)}50%{transform:scale(1.018,1.008) translateY(-3px)}}
@keyframes dumbbellCurl{0%,18%,100%{transform:rotate(-14deg) translate(-2px,8px)}48%,62%{transform:rotate(39deg) translate(20px,-55px)}}

@media(max-width:900px){
  .auth-wrap,.register-mode .auth-wrap{grid-template-columns:minmax(250px,.82fr) 1.18fr;max-width:850px}
  .auth-story{min-height:650px;padding:28px}
  .auth-story-copy{margin-top:auto;padding-top:290px}
  .auth-story h1{font-size:1.85rem}
  .auth-benefits{grid-template-columns:1fr}
  .auth-benefits span:last-child{grid-column:auto}
  .auth-panel,.register-mode .auth-panel{padding:32px 28px}
}
@media(max-width:720px){
  .auth-wrap,.register-mode .auth-wrap{grid-template-columns:1fr}
  .auth-story{min-height:400px;background:#10191d;padding:22px}
  .auth-story::before{top:28px;left:50%;width:260px;height:350px;background-size:auto,auto,auto,auto,118px 108px,118px 108px,auto,100px 132px,100px 132px,auto,auto}
  .auth-story::after{top:142px;left:calc(50% - 108px);width:130px;height:30px}
  .auth-story-copy{padding-top:205px;margin:0}
  .auth-story h1{font-size:1.65rem;margin-block:9px 5px}
  .auth-story-copy>p,.auth-benefits{display:none}
  .auth-panel,.register-mode .auth-panel{padding:30px 22px}
}
@media(max-width:420px){
  .auth-shell{padding:8px}.auth-wrap{border-radius:6px}.auth-story{min-height:340px;padding:18px}
  .auth-story-copy{padding-top:168px}.auth-story h1{font-size:1.42rem}.auth-kicker{font-size:.66rem}
  .auth-panel,.register-mode .auth-panel{padding:26px 16px}
}
@media(prefers-reduced-motion:reduce){.auth-story::before,.auth-story::after{animation:none}.auth-submit,.auth-input{transition:none}}

/* Layered HTML/CSS kinetic athlete */
.auth-story::before,.auth-story::after{display:none}
.auth-story-copy,.auth-brand{z-index:5}
.kinetic-athlete{position:absolute;z-index:1;inset:55px 0 auto;width:100%;height:430px;overflow:hidden;perspective:900px;pointer-events:none}
.kinetic-grid{position:absolute;inset:2% 7% 8%;opacity:.22;transform:rotateX(63deg) translateY(160px) scale(1.15);background-image:linear-gradient(rgba(117,231,220,.34) 1px,transparent 1px),linear-gradient(90deg,rgba(117,231,220,.34) 1px,transparent 1px);background-size:24px 24px;mask-image:linear-gradient(to bottom,transparent,#000 35%,transparent 92%)}
.kinetic-orbit{position:absolute;left:50%;top:47%;translate:-50% -50%;border:1px solid rgba(102,224,214,.28);border-radius:50%;animation:orbitPulse 4s ease-in-out infinite}
.orbit-a{width:330px;height:330px;border-right-color:#20a39e;border-left-color:rgba(255,107,74,.7)}
.orbit-b{width:270px;height:270px;border-width:2px;border-top-color:transparent;animation-delay:-1.3s;animation-direction:reverse}
.orbit-c{width:205px;height:205px;border-style:dashed;opacity:.45;animation-duration:7s}
.kinetic-spark{position:absolute;width:5px;height:5px;border-radius:50%;background:#84eee5;box-shadow:0 0 0 6px rgba(32,163,158,.1),0 0 20px #20a39e;animation:sparkFloat 3.5s ease-in-out infinite}
.spark-a{top:18%;left:19%}.spark-b{top:32%;right:15%;animation-delay:-1.2s;background:#ff7658;box-shadow:0 0 0 6px rgba(255,107,74,.1),0 0 20px #ff6b4a}.spark-c{top:62%;left:14%;animation-delay:-2.1s}
.athlete-shadow{position:absolute;bottom:28px;left:50%;width:170px;height:25px;translate:-50%;border-radius:50%;background:rgba(0,0,0,.58);filter:blur(10px);animation:shadowBeat 3.2s ease-in-out infinite}
.athlete-body{position:absolute;left:50%;top:40px;width:230px;height:360px;translate:-50%;filter:drop-shadow(0 22px 24px rgba(0,0,0,.42));animation:bodyBreathe 3.2s ease-in-out infinite}
.athlete-head{position:absolute;z-index:8;left:91px;top:0;width:55px;height:67px;border-radius:42% 48% 45% 46%;background:linear-gradient(115deg,#ffe0bd 3%,#e99a71 68%,#b85f48);box-shadow:inset -8px -7px 12px rgba(94,35,30,.2),-5px 3px 0 #14343a}
.athlete-head:before{content:"";position:absolute;inset:-6px 4px auto -4px;height:27px;border-radius:70% 45% 25% 20%;background:#112a30;transform:rotate(-6deg)}
.athlete-head:after{content:"";position:absolute;right:5px;top:31px;width:18px;height:8px;border-bottom:2px solid rgba(77,35,30,.65);border-radius:50%;transform:rotate(-5deg)}
.athlete-head i{position:absolute;right:11px;top:25px;width:4px;height:4px;border-radius:50%;background:#102227;box-shadow:-19px 1px 0 #102227}
.athlete-neck{position:absolute;z-index:5;left:101px;top:55px;width:38px;height:33px;background:linear-gradient(90deg,#bd664d,#f2b184 55%,#d87a5a);clip-path:polygon(12% 0,88% 0,100% 100%,0 100%)}
.athlete-torso{position:absolute;z-index:4;left:57px;top:76px;width:125px;height:158px;border-radius:34% 34% 22% 22%/18% 18% 12% 12%;background:linear-gradient(120deg,#31c1b5 0%,#16827f 48%,#0c4548 100%);clip-path:polygon(19% 0,81% 0,100% 20%,87% 100%,13% 100%,0 20%);box-shadow:inset 15px 0 22px rgba(99,244,225,.17),inset -15px -4px 22px rgba(3,29,33,.35)}
.athlete-torso:before,.athlete-torso:after{content:"";position:absolute;top:29px;width:45px;height:2px;background:rgba(185,255,247,.25)}
.athlete-torso:before{left:10px;transform:rotate(12deg)}.athlete-torso:after{right:10px;transform:rotate(-12deg)}
.chest-line{position:absolute;left:50%;top:23px;width:1px;height:92px;background:linear-gradient(transparent,rgba(194,255,247,.34),transparent)}
.shirt-mark{position:absolute;left:49px;top:56px;width:27px;height:27px;border:2px solid rgba(255,255,255,.65);border-left-color:#ff7658;border-radius:50%;transform:rotate(25deg)}
.athlete-arm{position:absolute;z-index:3;top:84px;width:58px;height:177px}.athlete-arm i{position:absolute;display:block}
.arm-back{right:5px;transform:rotate(-7deg);transform-origin:28px 12px}.arm-curl{left:5px;transform:rotate(6deg);transform-origin:30px 12px}
.athlete-arm .upper{top:2px;left:14px;width:32px;height:92px;border-radius:45% 52% 43% 48%;background:linear-gradient(90deg,#c66c51,#f4ae7d 52%,#a94d42);box-shadow:inset 5px 0 8px rgba(255,221,185,.2)}
.athlete-arm .joint{top:78px;left:13px;width:34px;height:34px;border-radius:50%;background:#d67c5c}
.athlete-arm .forearm{top:91px;left:15px;width:29px;height:72px;border-radius:48% 52% 35% 40%;background:linear-gradient(90deg,#a94e41,#efa175 55%,#bd604c)}
.athlete-arm .hand{top:151px;left:12px;width:34px;height:30px;border-radius:45%;background:#e3976e}
.arm-back .upper{background:linear-gradient(90deg,#126b6c,#23a49d 55%,#0b4448)}
.arm-back .forearm{background:linear-gradient(90deg,#ad5544,#e6986e 56%,#9f463c)}
.curl-rig{position:absolute;inset:0;transform-origin:30px 92px;animation:curlLift 3.2s cubic-bezier(.62,.02,.3,1) infinite}
.curl-rig .joint{top:78px}.curl-rig .forearm{top:91px}.curl-rig .hand{top:151px}
.dumbbell{position:absolute;z-index:12;left:-34px;top:159px;width:94px;height:18px;background:#b9d3d1;border-radius:4px;transform:rotate(3deg);box-shadow:0 8px 15px rgba(0,0,0,.32)}
.dumbbell:before,.dumbbell:after,.dumbbell em,.dumbbell span{content:"";position:absolute;top:-14px;width:17px;height:46px;border-radius:4px;background:linear-gradient(90deg,#ff7556,#c83f2e);box-shadow:inset -4px 0 5px rgba(67,11,7,.28)}
.dumbbell:before{left:-6px}.dumbbell:after{right:-6px}.dumbbell em{left:8px;height:38px;top:-10px;background:#173d42}.dumbbell span{right:8px;height:38px;top:-10px;background:#173d42}.dumbbell strong{position:absolute;left:42px;top:4px;width:12px;height:10px;background:#718f90;border-radius:2px}
.athlete-hips{position:absolute;z-index:6;left:69px;top:219px;width:103px;height:42px;background:linear-gradient(100deg,#142d33,#091d22);clip-path:polygon(0 0,100% 0,89% 100%,11% 100%)}
.athlete-leg{position:absolute;z-index:2;top:245px;width:48px;height:106px;background:linear-gradient(90deg,#0b2228,#173c43 52%,#081a1e);clip-path:polygon(9% 0,91% 0,72% 89%,28% 89%)}
.leg-a{left:70px;transform:rotate(2deg)}.leg-b{right:58px;transform:rotate(-2deg)}
.athlete-leg i{position:absolute;bottom:0;left:10px;width:29px;height:37px;background:#102c32;clip-path:polygon(14% 0,86% 0,100% 100%,0 100%)}
.athlete-leg b{position:absolute;bottom:-5px;left:0;width:49px;height:13px;border-radius:11px 17px 5px 5px;background:#e7f2ef;box-shadow:inset 20px 0 #ff6b4a}
.kinetic-caption{position:absolute;left:25px;right:25px;bottom:10px;display:flex;direction:ltr;justify-content:space-between;align-items:center;color:rgba(213,242,239,.55);font:600 9px/1 monospace!important;letter-spacing:2px}.kinetic-caption b{font:800 24px/1 monospace!important;color:rgba(255,107,74,.7)}
@keyframes curlLift{0%,16%,100%{transform:rotate(0)}46%,66%{transform:rotate(112deg)}}
@keyframes bodyBreathe{0%,100%{transform:translateY(2px) scale(1)}50%{transform:translateY(-2px) scale(1.012,1.004)}}
@keyframes shadowBeat{0%,100%{transform:scaleX(1);opacity:.6}50%{transform:scaleX(.88);opacity:.43}}
@keyframes orbitPulse{0%,100%{transform:rotate(0deg) scale(.98);opacity:.45}50%{transform:rotate(180deg) scale(1.04);opacity:.8}}
@keyframes sparkFloat{0%,100%{transform:translateY(0);opacity:.45}50%{transform:translateY(-15px);opacity:1}}
@media(max-width:900px){.kinetic-athlete{top:54px;height:410px;transform:scale(.88);transform-origin:50% 0}.auth-story-copy{padding-top:320px}}
@media(max-width:720px){.kinetic-athlete{top:18px;height:330px;transform:scale(.72);transform-origin:50% 0}.auth-story-copy{padding-top:220px}.kinetic-caption{display:none}}
@media(max-width:420px){.kinetic-athlete{top:12px;transform:scale(.64)}.auth-story-copy{padding-top:182px}}
@media(prefers-reduced-motion:reduce){.curl-rig,.athlete-body,.athlete-shadow,.kinetic-orbit,.kinetic-spark{animation:none}}

/* Professional WebGL scene */
.auth-webgl-stage{position:absolute;z-index:1;inset:52px 0 auto;width:100%;height:455px;overflow:hidden;direction:ltr;cursor:grab;touch-action:pan-y}
.auth-webgl-stage:active{cursor:grabbing}
.auth-webgl-stage canvas{display:block;width:100%;height:100%;filter:saturate(1.04) contrast(1.03)}
.auth-webgl-stage:before{content:"";position:absolute;z-index:-1;left:50%;top:46%;width:310px;height:310px;translate:-50% -50%;border-radius:50%;background:radial-gradient(circle,rgba(30,166,158,.19),rgba(30,166,158,.04) 53%,transparent 72%);border:1px solid rgba(93,222,213,.11)}
.webgl-status{position:absolute;left:26px;right:26px;bottom:8px;display:flex;direction:ltr;align-items:center;gap:8px;color:rgba(207,239,236,.52);font:700 9px/1 monospace!important;letter-spacing:2px}
.webgl-status:after{content:"";height:1px;flex:1;background:linear-gradient(90deg,rgba(62,192,184,.45),transparent)}
.webgl-status i{width:5px;height:5px;border-radius:50%;background:#3dd2c7;box-shadow:0 0 10px #3dd2c7;animation:webglSignal 1.8s ease-in-out infinite}
.webgl-unavailable .auth-webgl-stage{display:none}
@keyframes webglSignal{50%{opacity:.25;box-shadow:0 0 3px #3dd2c7}}
@media(max-width:900px){.auth-webgl-stage{top:46px;height:440px}.auth-story-copy{padding-top:345px}}
@media(max-width:720px){.auth-webgl-stage{top:4px;height:350px}.auth-story-copy{padding-top:238px}.webgl-status{display:none}}
@media(max-width:420px){.auth-webgl-stage{height:305px}.auth-story-copy{padding-top:190px}}
@media(prefers-reduced-motion:reduce){.webgl-status i{animation:none}}

/* Transparent silhouette campaign */
.auth-webgl-stage{display:none!important}
.silhouette-stage{position:absolute;z-index:1;inset:56px 0 auto;height:440px;overflow:hidden;pointer-events:none;direction:ltr}
.silhouette-stage:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 44%,rgba(32,163,158,.18),transparent 47%),linear-gradient(rgba(255,255,255,.028) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.028) 1px,transparent 1px);background-size:auto,28px 28px,28px 28px;mask-image:linear-gradient(to bottom,transparent,#000 15%,#000 80%,transparent)}
.silhouette-glow{position:absolute;left:50%;top:46%;width:310px;height:310px;translate:-50% -50%;border-radius:50%;background:radial-gradient(circle,rgba(40,198,188,.28),rgba(20,106,105,.09) 48%,transparent 70%);filter:blur(3px);animation:silhouetteGlow 3.8s ease-in-out infinite}
.silhouette-orbit{position:absolute;left:50%;top:45%;translate:-50% -50%;border-radius:50%;border:1px solid rgba(99,226,216,.28)}
.orbit-outer{width:365px;height:365px;border-right-color:#ff6b4a;border-bottom-color:transparent;animation:silhouetteOrbit 12s linear infinite}
.orbit-inner{width:290px;height:290px;border-width:2px;border-left-color:transparent;border-top-color:rgba(255,107,74,.5);animation:silhouetteOrbit 8s linear infinite reverse}
.silhouette-figure{position:absolute;z-index:3;left:50%;top:30px;width:385px;height:385px;translate:-50% 0;background:linear-gradient(125deg,#8ff1e8 5%,#24b8af 42%,#0b5a60 76%,#ff7758 125%);-webkit-mask:url('../images/auth/bodybuilder-silhouette.png') center/contain no-repeat;mask:url('../images/auth/bodybuilder-silhouette.png') center/contain no-repeat;filter:drop-shadow(0 22px 25px rgba(0,0,0,.45));transform-origin:50% 72%;animation:silhouetteBreathe 3.8s cubic-bezier(.45,0,.25,1) infinite}
.silhouette-figure img{width:100%;height:100%;object-fit:contain;opacity:0}
.silhouette-sheen{position:absolute;inset:0;background:linear-gradient(105deg,transparent 28%,rgba(255,255,255,.72) 44%,transparent 58%);transform:translateX(-130%);animation:silhouetteSheen 5.2s ease-in-out infinite}
.silhouette-shadow{position:absolute;z-index:2;left:50%;bottom:30px;width:235px;height:20px;translate:-50%;border-radius:50%;background:rgba(0,0,0,.58);filter:blur(11px);animation:silhouetteShadow 3.8s ease-in-out infinite}
.silhouette-pulse{position:absolute;z-index:1;border-radius:50%;background:#54ddd3;box-shadow:0 0 0 7px rgba(84,221,211,.08),0 0 20px rgba(84,221,211,.7);animation:silhouetteDot 3s ease-in-out infinite}
.pulse-a{left:14%;top:36%;width:5px;height:5px}.pulse-b{right:15%;top:24%;width:4px;height:4px;background:#ff795b;box-shadow:0 0 0 7px rgba(255,121,91,.08),0 0 20px rgba(255,121,91,.7);animation-delay:-1.4s}
@keyframes silhouetteBreathe{0%,100%{transform:translateY(3px) scale(1)}48%{transform:translateY(-5px) scale(1.025,1.012)}62%{transform:translateY(-4px) scale(1.02,1.009)}}
@keyframes silhouetteSheen{0%,56%{transform:translateX(-130%)}82%,100%{transform:translateX(130%)}}
@keyframes silhouetteGlow{0%,100%{transform:scale(.94);opacity:.55}50%{transform:scale(1.08);opacity:1}}
@keyframes silhouetteOrbit{to{transform:rotate(360deg)}}
@keyframes silhouetteShadow{0%,100%{transform:scaleX(1);opacity:.62}50%{transform:scaleX(.86);opacity:.4}}
@keyframes silhouetteDot{0%,100%{transform:translateY(0);opacity:.35}50%{transform:translateY(-14px);opacity:1}}
@media(max-width:900px){.silhouette-stage{top:48px;height:425px}.silhouette-figure{width:350px;height:350px}.auth-story-copy{padding-top:330px}}
@media(max-width:720px){.silhouette-stage{top:5px;height:345px}.silhouette-figure{top:6px;width:300px;height:300px}.orbit-outer{width:300px;height:300px}.orbit-inner{width:245px;height:245px}.silhouette-shadow{bottom:27px;width:190px}.auth-story-copy{padding-top:230px}}
@media(max-width:420px){.silhouette-stage{height:305px}.silhouette-figure{width:265px;height:265px}.orbit-outer{width:270px;height:270px}.orbit-inner{width:220px;height:220px}.auth-story-copy{padding-top:184px}}
@media(prefers-reduced-motion:reduce){.silhouette-figure,.silhouette-sheen,.silhouette-glow,.silhouette-orbit,.silhouette-shadow,.silhouette-pulse{animation:none}}

/* Bright authentication theme */
.auth-shell{background-color:#f7fdff;background-image:linear-gradient(rgba(22,138,173,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(22,138,173,.045) 1px,transparent 1px)}
.auth-wrap{background:#fff;border-color:#cbeae5;box-shadow:0 28px 65px rgba(22,138,173,.15)}
.auth-story{background-color:#dff9f5;background-image:radial-gradient(circle at 16% 20%,rgba(255,209,102,.8) 0 3px,transparent 4px),radial-gradient(circle at 82% 29%,rgba(255,111,97,.58) 0 3px,transparent 4px),linear-gradient(rgba(22,138,173,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(22,138,173,.055) 1px,transparent 1px);border-left:1px solid #bce7e0;color:#174a63}
.auth-brand{color:#174a63;text-shadow:none}.auth-brand span{background:linear-gradient(135deg,#ff6f61,#ffd166);color:#fff;box-shadow:0 8px 20px rgba(255,111,97,.24)}
.auth-story-copy{text-shadow:none}.auth-story h1{color:#174a63}.auth-story-copy>p{color:#4d7585}
.auth-kicker{background:rgba(255,255,255,.78);border-right-color:#ff6f61;color:#087f8c;box-shadow:0 7px 18px rgba(22,138,173,.09)}
.auth-benefits span{background:rgba(255,255,255,.76);border-color:#bfe9e3;color:#315f72;backdrop-filter:blur(7px)}
.auth-benefits i{color:#ff6f61}
.auth-panel{background:#fff}.auth-heading h2,.auth-form>label,.auth-row>label{color:#174a63}.auth-heading p{color:#668895}
.auth-icon{background:#e5faf6;color:#0a948d}.auth-input{background:#fbfeff;border-color:#cae7e3}.auth-input>i{color:#34afa7}
.auth-input:focus-within{border-color:#21b6a8;box-shadow:0 0 0 4px rgba(33,182,168,.12)}
.auth-submit{background:linear-gradient(135deg,#ff6f61,#ff8a65)!important;box-shadow:0 12px 25px rgba(255,111,97,.25)!important}.auth-submit:hover{background:linear-gradient(135deg,#f35d53,#ff7959)!important}
.auth-options>a,.auth-switch a{color:#087f8c}.auth-switch{border-top-color:#d8ece9}.check-label{color:#587887!important}
.silhouette-stage:before{background:radial-gradient(circle at 50% 44%,rgba(24,183,166,.2),transparent 47%),linear-gradient(rgba(22,138,173,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(22,138,173,.045) 1px,transparent 1px)}
.silhouette-glow{background:radial-gradient(circle,rgba(255,209,102,.55),rgba(85,210,198,.2) 48%,transparent 70%)}
.silhouette-orbit{border-color:rgba(22,138,173,.3)}.orbit-outer{border-right-color:#ff6f61}.orbit-inner{border-top-color:#f2b632}
.silhouette-figure{background:linear-gradient(125deg,#087f8c 3%,#18b7a6 42%,#168aad 72%,#ff6f61 118%);filter:drop-shadow(0 20px 20px rgba(22,138,173,.24))}
.silhouette-shadow{background:rgba(22,138,173,.2)}
@media(max-width:720px){.auth-story{background-color:#dff9f5}}

/* Auth fields use a single clean surface, without nested borders. */
.auth-form .auth-input{
  border:0!important;
  box-shadow:none!important;
  outline:0!important;
  background:#f1faf9!important;
}
.auth-form .auth-input:focus-within{
  border:0!important;
  box-shadow:none!important;
  outline:0!important;
  background:#e7f8f5!important;
}
.auth-form .auth-input input,
.auth-form .auth-input input:focus,
.auth-form .auth-input input:focus-visible{
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
  background:transparent!important;
}