/* A clothing label suspended above a continuous fabric set. */
.login-stage{--parallax-x:0px;--parallax-y:0px;position:relative;isolation:isolate;height:calc(100svh - 80px);min-height:660px;overflow:hidden;background:#dddcD8;color:#252526;display:block;padding:0}
.entrance-backdrop{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none;background:#dddcd8}
.fabric-layer{position:absolute;inset:-6%;width:112%;height:112%;overflow:visible;transition:transform 1.15s cubic-bezier(.18,.65,.25,1);will-change:transform}
.fabric-distant{transform:translate3d(calc(var(--parallax-x) * -.2),calc(var(--parallax-y) * -.2),0);opacity:.8}
.fabric-middle{transform:translate3d(calc(var(--parallax-x) * .65),calc(var(--parallax-y) * .65),0);filter:drop-shadow(18px 13px 25px #0000002b)}
.fabric-near{transform:translate3d(calc(var(--parallax-x) * 1.25),calc(var(--parallax-y) * 1.25),0);filter:drop-shadow(0 -15px 26px #17191a26)}
.entrance-grain{position:absolute;inset:0;opacity:.15;mix-blend-mode:multiply;background-image:repeating-linear-gradient(0deg,#44444426 0,#44444426 .4px,transparent .4px,transparent 3px),repeating-linear-gradient(90deg,#ffffffaa 0,#ffffffaa .4px,transparent .4px,transparent 3px);pointer-events:none}
.hang-space{position:absolute;left:34%;top:48%;width:250px;height:430px;perspective:1400px;transform:translate3d(calc(-50% + var(--parallax-x) * .4),calc(-50% + var(--parallax-y) * .4),0);transition:transform 1s cubic-bezier(.18,.65,.25,1);pointer-events:none}
.tag-sway{position:relative;width:100%;height:100%;transform-style:preserve-3d;transform-origin:50% -180px;animation:label-sway 9s ease-in-out infinite}
.tag-string{position:absolute;bottom:calc(100% - 35px);left:calc(50% - 1px);width:2px;height:900px;background:#555350;box-shadow:1px 0 0 #e5e0d885;transform:translateZ(3px);z-index:3}
.tag-string:after{content:'';position:absolute;left:-4px;bottom:-2px;width:9px;height:12px;border:1px solid #615d57;border-top:0;border-radius:0 0 5px 5px;background:none}
.tag-rotor{position:relative;width:100%;height:100%;transform-style:preserve-3d;animation:label-turn 20s linear infinite;will-change:transform}
.tag-face{position:absolute;inset:0;background:#211f20;backface-visibility:hidden;-webkit-backface-visibility:hidden;mask-image:radial-gradient(circle 8px at 50% 33px,transparent 0 7px,#000 8px);-webkit-mask-image:radial-gradient(circle 8px at 50% 33px,transparent 0 7px,#000 8px);box-shadow:inset 0 0 0 1px #ffffff19;overflow:hidden;display:flex;align-items:center;justify-content:center}
.tag-face:before{content:none}
.tag-face:after{content:'';position:absolute;left:calc(50% - 10px);top:23px;width:20px;height:20px;border:1px solid #5d5954;border-radius:50%;box-shadow:0 1px 0 #000;pointer-events:none}
.tag-front{transform:translateZ(1.3px)}
.tag-back{transform:rotateY(180deg) translateZ(1.3px)}
.tag-face img{display:block;width:83%;height:auto;position:relative;object-fit:contain;transform:translateY(-4px)}
.tag-edge{position:absolute;background:#494747;backface-visibility:visible}
.tag-edge-left,.tag-edge-right{top:0;width:2.6px;height:100%;transform:rotateY(90deg)}
.tag-edge-left{left:-1.3px}.tag-edge-right{right:-1.3px}
.tag-edge-bottom{left:0;bottom:-1.3px;width:100%;height:2.6px;transform:rotateX(90deg);background:#131212}
.tag-shadow{position:absolute;left:-13%;bottom:-88px;width:126%;height:50px;border-radius:50%;background:#161716;opacity:.24;filter:blur(18px);transform:rotate(-7deg);animation:label-shadow 20s linear infinite}
@keyframes label-turn{0%{transform:rotateY(-12deg)}100%{transform:rotateY(348deg)}}
@keyframes label-sway{0%,100%{transform:rotateZ(-3.5deg) rotateX(1deg)}50%{transform:rotateZ(2.5deg) rotateX(-2deg)}}
@keyframes label-shadow{0%,100%{transform:rotate(-7deg) scaleX(1);opacity:.24}25%,75%{transform:rotate(-7deg) scaleX(.23);opacity:.14}50%{transform:rotate(-7deg) scaleX(1);opacity:.24}}
.login-stage .login-sheet{position:absolute;left:65%;top:48%;transform:translateY(-50%);width:310px;max-width:none;margin:0;padding:0;border:0;box-shadow:none;clip-path:none;background:none;z-index:2}
.login-stage .login-sheet:before,.login-stage .login-sheet:after{content:none}
.login-stage .login-sheet-heading{display:block;margin:0 0 34px;padding:0;border:0}
.login-stage .login-sheet-heading h1{font:500 38px/1.1 var(--font,Arial,sans-serif);letter-spacing:-.05em;margin:0;color:#222324}
.login-stage .field{margin:0 0 22px;gap:10px}
.login-stage .field label{font-size:12px;font-weight:600;letter-spacing:0;color:#414244}
.login-stage .field input{height:47px;min-height:47px;border:0;border-bottom:1px solid #8e8f8c;background:#eeede74a;padding:10px 12px;color:#202122;border-radius:0;box-shadow:none;font-size:15px;outline-offset:4px;transition:background .2s,border-color .2s}
.login-stage .field input:focus{border-color:#242526;background:#f5f4efb3;outline:1px solid #585b5b}
.login-stage .input-password input{padding-right:47px}
.login-stage .input-password .icon-button{top:7px;right:7px;color:#4b4d4e}
.login-stage .login-submit{width:100%;min-height:47px;margin-top:10px;justify-content:space-between;background:#232121;border:1px solid #232121;color:#fff;padding:11px 15px;font-size:13px;font-weight:600}
.login-stage .login-submit:hover{background:#3b3939;border-color:#3b3939}
.login-stage .login-note{font-size:10px;line-height:1.75;color:#60615e;margin:23px 0 0;padding:0;max-width:265px;border:0;display:block}
.login-stage .form-error{font-size:11px;background:#f2dfd5;border-left:2px solid #9b3b32;padding:10px 12px;margin-bottom:16px}
.login-stage .form-error:empty{display:none}
.entrance-motion{position:absolute;bottom:25px;right:32px;display:flex;align-items:center;gap:9px;padding:8px 10px;border:0;background:#dddcd866;color:#5a5d5c;font:10px var(--font,Arial,sans-serif);z-index:3;cursor:pointer;min-height:35px}
.entrance-motion:hover{background:#e8e7e3b3;color:#202222}
.motion-symbol{font-family:Arial,sans-serif;font-size:12px;width:13px;text-align:center;line-height:1}
.login-stage.motion-paused .tag-sway,.login-stage.motion-paused .tag-rotor,.login-stage.motion-paused .tag-shadow,.login-stage.motion-hidden .tag-sway,.login-stage.motion-hidden .tag-rotor,.login-stage.motion-hidden .tag-shadow{animation-play-state:paused}
@media(min-width:1650px){.hang-space{width:286px;height:490px;left:35%}.login-stage .login-sheet{left:65%;width:340px}.tag-face{mask-image:radial-gradient(circle 9px at 50% 36px,transparent 0 8px,#000 9px);-webkit-mask-image:radial-gradient(circle 9px at 50% 36px,transparent 0 8px,#000 9px)}.tag-face:after{top:26px}.tag-string{bottom:calc(100% - 38px)}}
@media(max-width:1100px){.hang-space{left:31%;width:225px;height:395px}.login-stage .login-sheet{left:60%;width:290px}.fabric-middle{left:-10%}.login-stage{min-height:610px}.tag-shadow{bottom:-65px}}
@media(max-width:800px){.hang-space{left:27%;width:190px;height:335px}.login-stage .login-sheet{left:56%;width:270px}.fabric-middle{left:-15%}.login-stage .login-sheet-heading h1{font-size:34px}.login-stage{min-height:590px}}
@media(max-width:650px){.login-stage{height:auto;min-height:calc(100svh - 72px);padding:350px 28px 85px;overflow:hidden}.entrance-backdrop{background:#dddcd8}.fabric-distant{width:160%;left:-40%;opacity:.5}.fabric-middle{height:800px;left:-70%;top:-120px;width:160%;opacity:.85}.fabric-near{inset:auto auto -500px -105%;width:180%;height:900px;opacity:.9}.hang-space{width:164px;height:282px;top:33px;left:50%;transform:translateX(-50%);perspective:1000px}.tag-sway{transform-origin:50% -50px}.tag-string{height:400px;bottom:calc(100% - 25px);width:1px}.tag-face{mask-image:radial-gradient(circle 6px at 50% 23px,transparent 0 5px,#000 6px);-webkit-mask-image:radial-gradient(circle 6px at 50% 23px,transparent 0 5px,#000 6px)}.tag-face:after{width:14px;height:14px;left:calc(50% - 7px);top:16px}.tag-face img{width:87%}.tag-shadow{left:-12%;bottom:-31px;height:25px;filter:blur(11px);opacity:.2}.login-stage .login-sheet{position:relative;left:auto;top:auto;transform:none;width:100%;max-width:340px;margin:0 auto;background:none;padding:0}.login-stage .login-sheet-heading{margin-bottom:24px}.login-stage .login-sheet-heading h1{font-size:30px;letter-spacing:-.04em}.login-stage .field{margin-bottom:18px}.login-stage .field input{font-size:16px;background:#eeede77a}.login-stage .login-submit{margin-top:5px;min-height:47px}.login-stage .login-note{font-size:10px;margin-top:18px;max-width:280px;color:#5d605d}.entrance-motion{right:19px;bottom:18px;font-size:9px;background:#dddcd88a}.fabric-layer,.hang-space{transition:none}}
@media(max-width:375px){.login-stage{padding:310px 24px 78px}.hang-space{width:146px;height:250px;top:29px}.login-stage .login-sheet-heading{margin-bottom:21px}.login-stage .field{margin-bottom:16px}}
@media(prefers-reduced-motion:reduce){.login-stage:not(.motion-enabled) .tag-sway{animation:none;transform:rotateZ(-3deg)}.login-stage:not(.motion-enabled) .tag-rotor{animation:none;transform:rotateY(-12deg)}.login-stage:not(.motion-enabled) .tag-shadow{animation:none}.fabric-layer,.hang-space{transition:none!important}}

@media(prefers-reduced-motion:reduce){.login-stage.motion-enabled .tag-rotor{animation:label-turn 20s linear infinite!important}.login-stage.motion-enabled .tag-sway{animation:label-sway 9s ease-in-out infinite!important}.login-stage.motion-enabled .tag-shadow{animation:label-shadow 20s linear infinite!important}.login-stage.motion-hidden .tag-rotor,.login-stage.motion-hidden .tag-sway,.login-stage.motion-hidden .tag-shadow{animation-play-state:paused!important}}

/* Pause wins over all animation shorthands, including explicit reduced-motion opt-in. */
.login-stage.motion-paused .tag-rotor,.login-stage.motion-paused .tag-sway,.login-stage.motion-paused .tag-shadow,.login-stage.motion-hidden .tag-rotor,.login-stage.motion-hidden .tag-sway,.login-stage.motion-hidden .tag-shadow{animation-play-state:paused!important}