html,body.page-auth{width:100%;min-height:100%;margin:0;background:#050607!important}
body.page-auth{
  color:#f5ead9;font-family:Arial,sans-serif;background:#050607!important
}
body.page-auth::before{
  content:"";position:fixed;z-index:0;inset:0;pointer-events:none;
  background:
    radial-gradient(ellipse at 50% 42%,transparent 8%,rgba(0,0,0,.16) 57%,rgba(0,0,0,.72) 100%),
    url('../img/auth/login-fuego-hielo-desktop.webp') center/cover no-repeat
}
body.page-auth::after{
  content:"";position:fixed;z-index:0;inset:0;pointer-events:none;opacity:.38;
  background-image:radial-gradient(circle,rgba(255,180,105,.85) 0 1px,transparent 1.5px),radial-gradient(circle,rgba(112,190,255,.72) 0 1px,transparent 1.5px);
  background-size:109px 127px,157px 173px;background-position:18px 12px,77px 49px;animation:accountParticles 15s linear infinite
}
@keyframes accountParticles{to{background-position:18px -115px,77px -124px}}
.account-stage,.account-stage *{box-sizing:border-box}
.account-stage{
  position:relative;z-index:1;min-height:100svh;display:flex;flex-direction:column;align-items:center;
  padding:clamp(178px,21svh,225px) 20px 46px
}
.account-brand{
  position:absolute;z-index:4;top:clamp(12px,1.8svh,26px);left:50%;transform:translateX(-50%);
  width:min(44vw,670px);filter:drop-shadow(0 10px 18px rgba(0,0,0,.84));pointer-events:none
}
.account-brand img{display:block;width:100%;height:auto}
.account-panel{
  position:relative;isolation:isolate;width:min(500px,calc(100vw - 40px));min-height:470px;
  display:flex;flex-direction:column;justify-content:center;padding:66px 68px 58px;
  background:url('../img/auth/login-panel-main.png') center/100% 100% no-repeat;
  filter:drop-shadow(0 26px 45px rgba(0,0,0,.42))
}
.account-panel::before{
  content:"";position:absolute;z-index:-1;inset:11% 10% 10%;border:1px solid rgba(255,255,255,.2);border-radius:30px;
  background:radial-gradient(circle at 18% 0,rgba(255,255,255,.17),transparent 34%),linear-gradient(145deg,rgba(255,255,255,.1),rgba(6,10,16,.4) 48%,rgba(3,7,12,.62));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.25),inset 0 -1px 0 rgba(0,0,0,.34),0 22px 52px rgba(0,0,0,.3);
  -webkit-backdrop-filter:blur(23px) saturate(145%);backdrop-filter:blur(23px) saturate(145%);pointer-events:none
}
.account-panel--register{width:min(560px,calc(100vw - 40px));min-height:690px;padding:70px 78px 62px}
.account-panel--register::before{inset:8% 9% 7.5%}
.account-eyebrow{margin:0 0 9px;text-align:center;color:#eac486;font:800 10px/1.2 Arial,sans-serif;letter-spacing:.24em}
.account-icon{
  width:58px;height:58px;margin:0 auto 15px;display:grid;place-items:center;border:1px solid rgba(255,207,141,.4);border-radius:19px;
  color:#f3d39a;background:linear-gradient(145deg,rgba(255,152,80,.18),rgba(45,101,162,.16));
  box-shadow:inset 0 1px rgba(255,255,255,.22),0 11px 26px rgba(0,0,0,.24)
}
.account-icon svg{width:29px;height:29px;fill:none;stroke:currentColor;stroke-width:1.7}
.account-title{margin:0;text-align:center;color:#f6ddb1;text-shadow:0 2px 9px #000;font:700 clamp(24px,2vw,31px)/1.05 Georgia,serif;letter-spacing:.075em}
.account-intro{margin:10px auto 24px;text-align:center;color:rgba(240,231,216,.7);font-size:12px;line-height:1.55}
.account-form{display:grid;gap:0;width:100%}
.account-label{display:block;margin:0 0 6px;color:#d4c7b5;font-size:9px;font-weight:900;letter-spacing:.16em}
.account-input{
  width:100%;height:43px;margin:0 0 14px;padding:0 13px;border:1px solid rgba(255,255,255,.18);border-radius:13px;outline:none;
  background:linear-gradient(135deg,rgba(255,255,255,.105),rgba(3,7,12,.58));color:#fff;font:500 13px Arial,sans-serif;
  box-shadow:inset 0 1px rgba(255,255,255,.12),inset 0 -10px 22px rgba(0,0,0,.18),0 8px 20px rgba(0,0,0,.16);
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);transition:border-color .2s,box-shadow .2s,background .2s
}
.account-input::placeholder{color:rgba(223,226,232,.42)}
.account-input:focus{border-color:rgba(255,190,110,.82);background:linear-gradient(135deg,rgba(255,255,255,.15),rgba(7,10,16,.62));box-shadow:inset 0 1px rgba(255,255,255,.16),0 0 0 3px rgba(255,143,70,.12),0 8px 24px rgba(0,0,0,.24)}
.account-field{position:relative}.account-field .account-input{padding-right:74px}
.account-password-toggle{position:absolute;right:7px;top:5px;height:32px;padding:0 9px;border:0;border-radius:10px;background:transparent;color:#f4dfc0;font-size:9px;font-weight:900;cursor:pointer}
.account-password-toggle:hover{background:rgba(255,255,255,.09);color:#fff}
.account-submit,.account-button{
  min-height:46px;display:inline-flex;align-items:center;justify-content:center;margin-top:3px;padding:0 20px;
  border:1px solid rgba(255,205,139,.7);border-radius:15px;text-decoration:none;color:#fff1d9;
  background:linear-gradient(135deg,rgba(255,125,73,.64),rgba(126,31,24,.8) 48%,rgba(38,83,139,.58));
  box-shadow:inset 0 1px rgba(255,255,255,.34),inset 0 -10px 24px rgba(75,9,4,.22),0 12px 28px rgba(0,0,0,.3);
  font:700 13px/1 Georgia,serif;letter-spacing:.12em;cursor:pointer;transition:transform .2s,filter .2s
}
.account-submit:hover,.account-button:hover{filter:brightness(1.13);transform:translateY(-1px)}
.account-message{margin:0 0 16px;padding:10px 12px;border:1px solid rgba(255,255,255,.16);border-radius:12px;text-align:center;font-size:11px;line-height:1.45;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.account-message.is-error{color:#ffd1ca;border-color:rgba(255,139,124,.35);background:rgba(102,12,10,.38)}
.account-message.is-ok{color:#cffff0;border-color:rgba(92,232,169,.32);background:rgba(7,77,54,.38)}
.account-footer{display:flex;align-items:center;justify-content:center;gap:9px;margin-top:18px;text-align:center;color:rgba(239,224,198,.65);font-size:10px;font-weight:700;letter-spacing:.08em}
.account-footer a{color:#8fc8ff;text-decoration:none}.account-footer a:hover{color:#fff;text-decoration:underline}
.account-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}.account-actions.is-single{grid-template-columns:1fr}
.account-note{margin:15px 0 0;text-align:center;color:rgba(240,231,216,.5);font-size:10px;line-height:1.5}

.account-utility{
  position:fixed;z-index:7;top:50%;left:clamp(18px,2.2vw,42px);transform:translateY(-50%);
  display:flex;flex-direction:column;align-items:center;gap:10px;padding:13px 9px;border:1px solid rgba(255,255,255,.17);border-radius:30px;
  background:linear-gradient(145deg,rgba(255,255,255,.105),rgba(4,8,14,.48));box-shadow:inset 0 1px rgba(255,255,255,.22),0 20px 44px rgba(0,0,0,.36);
  -webkit-backdrop-filter:blur(22px) saturate(150%);backdrop-filter:blur(22px) saturate(150%)
}
.account-utility__link{
  position:relative;width:46px;height:46px;display:grid;place-items:center;padding:0;border:1px solid rgba(255,255,255,.16);border-radius:50%;
  color:#f5e5cd;background:linear-gradient(145deg,rgba(255,255,255,.13),rgba(8,13,21,.48));box-shadow:inset 0 1px rgba(255,255,255,.16),0 8px 18px rgba(0,0,0,.25);
  text-decoration:none;cursor:pointer;transition:transform .18s,border-color .18s,background .18s,color .18s
}
.account-utility__link svg{width:22px;height:22px;fill:currentColor}.account-utility__link span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.account-utility__link::after{
  content:attr(data-tip);position:absolute;left:calc(100% + 14px);top:50%;transform:translate(5px,-50%);width:max-content;padding:9px 12px;
  border:1px solid rgba(255,255,255,.16);border-radius:12px;background:rgba(6,10,16,.74);box-shadow:0 10px 25px rgba(0,0,0,.34);
  color:#f4e7d2;font-size:10px;font-weight:800;letter-spacing:.08em;white-space:nowrap;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);
  opacity:0;visibility:hidden;pointer-events:none;transition:opacity .18s,transform .18s,visibility .18s
}
.account-utility__link:hover,.account-utility__link:focus-visible{transform:translateX(3px) scale(1.04);border-color:rgba(255,195,118,.68);color:#fff;background:linear-gradient(145deg,rgba(255,145,78,.25),rgba(21,69,119,.42));outline:none}
.account-utility__link:hover::after,.account-utility__link:focus-visible::after{opacity:1;visibility:visible;transform:translate(0,-50%)}
.account-utility__link.is-disabled{opacity:.55;cursor:not-allowed}.account-utility__link.is-disabled:hover{transform:none;border-color:rgba(255,255,255,.16);background:linear-gradient(145deg,rgba(255,255,255,.13),rgba(8,13,21,.48))}

@media(max-width:940px){
  body.page-auth::before{background:radial-gradient(ellipse at 50% 38%,transparent 8%,rgba(0,0,0,.18) 58%,rgba(0,0,0,.75) 100%),url('../img/auth/login-fuego-hielo-mobile.webp') center top/cover no-repeat}
  .account-stage{padding:clamp(205px,27svh,320px) 16px 40px}
  .account-brand{width:min(88vw,480px);top:clamp(12px,2.5svh,28px)}
  .account-panel,.account-panel--register{width:min(520px,94vw);min-height:0;padding:64px clamp(42px,10vw,66px) 56px}
  .account-panel--register{padding-top:68px}
  .account-panel::before,.account-panel--register::before{inset:8% 8% 7%}
  .account-utility{position:relative;top:auto;left:auto;transform:none;width:min(330px,84vw);margin:15px auto 0;flex-direction:row;justify-content:center;gap:clamp(7px,2.5vw,12px);padding:10px 12px;border-radius:28px}
  .account-utility__link{width:44px;height:44px}.account-utility__link:hover,.account-utility__link:focus-visible{transform:translateY(-2px) scale(1.03)}.account-utility__link::after{display:none}
}
@media(max-width:520px){
  .account-panel,.account-panel--register{width:96vw;padding:58px 38px 49px}
  .account-panel::before,.account-panel--register::before{inset:6.5% 6% 5.5%;border-radius:24px}
  .account-input{font-size:16px}.account-actions{grid-template-columns:1fr}.account-footer{flex-direction:column;gap:5px}
}
@media(prefers-reduced-motion:reduce){body.page-auth::after{animation:none}.account-utility__link,.account-submit,.account-button{transition:none!important}}