/* صفحه ورود میوا — B+ (۱۴۰۵/۰۷/۱۳). فقط از login.html لود می‌شود.
   جلوه‌ها: شفق متحرک، ذرات، کارت شیشه‌ای + حاشیه‌ی گردان، نور ماوس + tilt، دکمه‌ی گرادیانی.
   همه‌چیز فقط transform/opacity است؛ prefers-reduced-motion و صفحه‌ی لمسی خودکار ساده می‌شوند. */
@property --mw-ang{syntax:"<angle>";inherits:false;initial-value:0deg}
.mw-login-body .content{padding:0;display:block}
.mw-login-body .content-inner{max-width:none;width:100%;min-height:100%}
.mw-login-body .flash{display:none}
.mw-lg{--lg-leaf2:#2fa862;--lg-orange:#e4800d;--lg-glass:rgba(255,255,255,.58);--lg-glass-b:rgba(255,255,255,.75);--lg-spot:rgba(6,104,50,.14);--lg-bg1:#e7f3ea;--lg-bg2:#fdf1e1;--lg-shadow:0 24px 60px rgba(6,104,50,.16),0 3px 8px rgba(0,0,0,.06);--lg-p1:#e4800d;--lg-p2:#2fa862;--lg-field:var(--fill-secondary);--lg-grad-a:var(--leaf);--lg-grad-b:#2fa862;--lg-onbtn:#fff;
  position:relative;min-height:calc(100dvh - 58px);padding:32px 16px;display:grid;place-items:center;overflow:hidden;
  background:radial-gradient(120% 90% at 20% 0%,var(--lg-bg1),transparent 60%),radial-gradient(100% 80% at 90% 100%,var(--lg-bg2),transparent 60%),var(--surface)}
[data-theme="dark"] .mw-lg{--lg-leaf2:#7fe0a0;--lg-orange:#f5a04a;--lg-glass:rgba(18,24,19,.55);--lg-glass-b:rgba(255,255,255,.1);--lg-spot:rgba(127,224,160,.16);--lg-bg1:#06150b;--lg-bg2:#1a0f03;--lg-shadow:0 30px 80px rgba(0,0,0,.65),0 0 0 1px rgba(255,255,255,.04);--lg-p1:#ffd27a;--lg-p2:#7fe0a0;--lg-field:rgba(255,255,255,.07);--lg-grad-a:#4db36f;--lg-grad-b:#7fe0a0;--lg-onbtn:#05200e}
.mw-lg__theme{position:absolute;top:14px;inset-inline-start:14px;z-index:4}
.mw-lg__aur{position:absolute;inset:-20%;pointer-events:none;filter:blur(60px)}
.mw-lg__aur i{position:absolute;border-radius:50%;will-change:transform}
.mw-lg__aur i:nth-child(1){width:55vmax;height:55vmax;top:-18vmax;inset-inline-start:-12vmax;background:radial-gradient(circle,var(--leaf) 0,transparent 65%);opacity:.38;animation:mwlgA 24s ease-in-out infinite alternate}
.mw-lg__aur i:nth-child(2){width:48vmax;height:48vmax;bottom:-16vmax;inset-inline-end:-10vmax;background:radial-gradient(circle,var(--lg-orange) 0,transparent 65%);opacity:.32;animation:mwlgB 28s ease-in-out infinite alternate}
.mw-lg__aur i:nth-child(3){width:34vmax;height:34vmax;top:30%;inset-inline-end:28%;background:radial-gradient(circle,var(--lg-leaf2) 0,transparent 65%);opacity:.22;animation:mwlgC 20s ease-in-out infinite alternate}
@keyframes mwlgA{to{transform:translate(14vmax,9vmax) scale(1.2)}}
@keyframes mwlgB{to{transform:translate(-12vmax,-7vmax) scale(1.12)}}
@keyframes mwlgC{to{transform:translate(-9vmax,11vmax) scale(.85)}}
.mw-lg__pat{position:absolute;inset:0;opacity:.045;background:url("../miwa/img/miwa-mark.png") 0 0/90px repeat;pointer-events:none;-webkit-mask:radial-gradient(70% 60% at 50% 50%,#000 20%,transparent 100%);mask:radial-gradient(70% 60% at 50% 50%,#000 20%,transparent 100%)}
[data-theme="dark"] .mw-lg__pat{opacity:.07;filter:invert(1) brightness(1.2)}
.mw-lg__pt{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.mw-lg__pt b{position:absolute;bottom:-20px;border-radius:50%;background:var(--lg-p1);box-shadow:0 0 12px 2px var(--lg-p1);opacity:0;animation:mwlgUp linear infinite;will-change:transform,opacity}
.mw-lg__pt b:nth-child(3n){background:var(--lg-p2);box-shadow:0 0 12px 2px var(--lg-p2)}
@keyframes mwlgUp{0%{transform:translate(0,0) scale(.6);opacity:0}12%{opacity:.85}85%{opacity:.6}100%{transform:translate(var(--dx),-108vh) scale(1.1);opacity:0}}
.mw-lg__scene{position:relative;z-index:2;perspective:1100px;width:100%;max-width:410px}
.mw-lg__card{position:relative;padding:34px 28px 26px;border-radius:28px;text-align:center;background:var(--lg-glass);box-shadow:var(--lg-shadow);backdrop-filter:blur(22px) saturate(150%);-webkit-backdrop-filter:blur(22px) saturate(150%);transform-style:preserve-3d;transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .18s ease-out;animation:mwlgEnter .8s cubic-bezier(.2,.9,.2,1) both}
@supports not (backdrop-filter:blur(1px)){.mw-lg__card{background:var(--surface-raised)}}
@keyframes mwlgEnter{from{opacity:0;transform:translateY(30px) scale(.94) rotateX(8deg)}to{opacity:1}}
.mw-lg__card::before{content:"";position:absolute;inset:-1.5px;border-radius:inherit;padding:1.5px;background:conic-gradient(from var(--mw-ang),transparent 0 55%,var(--lg-leaf2) 72%,var(--lg-orange) 86%,transparent 100%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:mwlgSpin 6s linear infinite;pointer-events:none;opacity:.9}
@keyframes mwlgSpin{to{--mw-ang:360deg}}
.mw-lg__card::after{content:"";position:absolute;inset:0;border-radius:inherit;background:radial-gradient(380px circle at var(--mx,50%) var(--my,0%),var(--lg-spot),transparent 60%);pointer-events:none;opacity:var(--so,0);transition:opacity .3s}
.mw-lg__card>*{position:relative;z-index:1}
.mw-lg__logo{position:relative;display:block;width:min(210px,64%);margin:0 auto 14px;overflow:hidden;border-radius:8px}
.mw-lg__logo img{display:block;width:100%;height:auto}
[data-theme="dark"] .mw-lg__logo img{filter:brightness(1.3) saturate(1.1) drop-shadow(0 0 14px rgba(127,224,160,.3))}
.mw-lg__logo::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.38) 50%,transparent 65%);transform:translateX(-120%);animation:mwlgShine 1.2s .9s ease-out 1 forwards}
@keyframes mwlgShine{to{transform:translateX(120%)}}
.mw-lg__title{font-size:22px;margin:0 0 4px}
.mw-lg__sub{margin:0 0 22px;color:var(--ink-muted);font-size:14px}
.mw-lg__form{text-align:right}
.mw-lg__f{margin-bottom:14px;position:relative}
.mw-lg__f label{display:block;font-size:13px;color:var(--ink-muted);margin-bottom:5px;transition:color .2s}
.mw-lg__f:focus-within label{color:var(--lg-leaf2)}
.mw-lg__f input{width:100%;min-height:50px;padding:0 14px;border:1.5px solid transparent;border-radius:14px;background:var(--lg-field);color:var(--ink);font:inherit;font-size:16px;outline:0;transition:border-color .2s,box-shadow .25s,background .2s}
.mw-lg__f input:focus{border-color:var(--lg-leaf2);background:color-mix(in srgb,var(--surface-raised) 70%,transparent);box-shadow:0 0 0 4px color-mix(in srgb,var(--lg-leaf2) 20%,transparent),0 6px 22px color-mix(in srgb,var(--lg-leaf2) 22%,transparent)}
.mw-lg__eye{position:absolute;inset-inline-start:6px;bottom:7px;width:36px;height:36px;border:0;border-radius:10px;background:transparent;color:var(--ink-muted);cursor:pointer;display:grid;place-items:center;transition:color .2s,background .2s}
.mw-lg__eye:hover{color:var(--lg-leaf2);background:var(--lg-field)}
.mw-lg__f--pw input{padding-inline-start:46px}
.mw-lg__caps{display:none;margin:6px 2px 0;font-size:12.5px;color:#9a5b00;background:#fff3dd;border-radius:8px;padding:5px 10px}
[data-theme="dark"] .mw-lg__caps{background:#3a2a0c;color:#f5c26b}
.mw-lg__caps.show{display:block}
.mw-lg__err{margin-bottom:12px;padding:9px 12px;border-radius:12px;background:color-mix(in srgb,var(--berry) 14%,transparent);color:var(--berry);font-size:13.5px;text-align:right}
.mw-lg__btn{position:relative;overflow:hidden;width:100%;min-height:52px;margin-top:8px;border:0;border-radius:15px;background:linear-gradient(120deg,var(--lg-grad-a),var(--lg-grad-b));color:var(--lg-onbtn);font:inherit;font-size:16px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:10px;box-shadow:0 8px 24px color-mix(in srgb,var(--leaf) 40%,transparent);transition:transform .15s,box-shadow .25s}
.mw-lg__btn:hover{transform:translateY(-2px);box-shadow:0 14px 32px color-mix(in srgb,var(--leaf) 50%,transparent)}
.mw-lg__btn:active{transform:scale(.98)}
.mw-lg__btn::before{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,.4) 50%,transparent 70%);transform:translateX(-130%)}
.mw-lg__btn:hover::before{transform:translateX(130%);transition:transform .7s}
.mw-lg__rip{position:absolute;border-radius:50%;background:rgba(255,255,255,.45);transform:scale(0);animation:mwlgRp .6s ease-out forwards;pointer-events:none}
@keyframes mwlgRp{to{transform:scale(4);opacity:0}}
.mw-lg__btn[disabled]{cursor:wait;filter:saturate(.8)}
.mw-lg__spin{width:18px;height:18px;border:2.5px solid color-mix(in srgb,var(--lg-onbtn) 30%,transparent);border-top-color:var(--lg-onbtn);border-radius:50%;animation:mwlgRot .7s linear infinite;display:none}
.mw-lg__btn.is-load .mw-lg__spin{display:block}
@keyframes mwlgRot{to{transform:rotate(360deg)}}
.mw-lg__scene.is-shake{animation:mwlgShake .45s}
@keyframes mwlgShake{20%,60%{transform:translateX(-9px)}40%,80%{transform:translateX(9px)}}
.mw-lg .st{animation:mwlgRise .6s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--i)*80ms + 250ms)}
@keyframes mwlgRise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@media (pointer:coarse){.mw-lg__card{transform:none!important}}
@media (max-width:820px){.mw-lg{min-height:calc(100dvh - 78px);padding:20px 14px}.mw-lg__card{padding:28px 20px 22px}}
@media (prefers-reduced-motion:reduce){.mw-lg *,.mw-lg *::before,.mw-lg *::after{animation:none!important;transition:none!important}.mw-lg__pt{display:none}}
/* گذار خروج هنگام ورود موفق (login.html پرچم می‌گذارد؛ پنل انیمیشن ورود را پخش می‌کند) */
.mw-lg.is-leaving .mw-lg__scene{transition:transform .35s cubic-bezier(.4,0,.2,1),opacity .3s ease;transform:translateY(-26px) scale(.94);opacity:0}
.mw-lg.is-leaving .mw-lg__aur,.mw-lg.is-leaving .mw-lg__pt,.mw-lg.is-leaving .mw-lg__pat{transition:opacity .35s ease;opacity:0}
