/* Adapted from scaffold-master Login.vue / pages.css (MIT). See login-LICENSE.txt. */
:root{--primary:#7952b3;--primary-light:#c5a8ee;--ink:#2c2735;--soft:#827a8e;--line:#ded9e5;--surface:#fcfbfd;--canvas:#f4f3f6;font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;color:var(--ink);background:var(--canvas);font-synthesis:none}
*{box-sizing:border-box}body,h1,h2,p,ul{margin:0}button,input,select{font:inherit}button{cursor:pointer}button:disabled{cursor:wait}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #b99adb;outline-offset:3px}[hidden]{display:none!important}svg{fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}button{color:inherit}
.login{position:relative;isolation:isolate;min-height:100dvh;display:grid;grid-template-columns:minmax(0,1.35fr) minmax(400px,1fr);padding:14px;overflow:clip}
.login-canvas{position:relative;display:flex;flex-direction:column;min-height:calc(100dvh - 28px);padding:34px 40px 28px;border-radius:30px;overflow:hidden;color:#f6f2fb;background:#211a2e;box-shadow:0 24px 70px #24152f20,inset 0 1px 0 #ffffff14}
.canvas-glow{position:absolute;inset:0;z-index:0;pointer-events:none;width:100%;height:100%}
.neural-net{position:absolute;inset:0;z-index:1;pointer-events:none;width:100%;height:100%}
.login-brand,.canvas-main,.cap-list{position:relative;z-index:2}
.canvas-glow{background:radial-gradient(40% 45% at 72% 42%,#a77de433,transparent 70%),radial-gradient(35% 40% at 18% 92%,#7952b333,transparent 70%)}
.login-brand{display:flex;align-items:center;gap:12px}.login-brand img,.mobile-brand img{border-radius:12px}.login-brand strong{display:block;font-size:17px;letter-spacing:.08em}.login-brand span{display:block;font-size:11px;color:#d7cbe1a8;margin-top:3px}
.canvas-main{flex:1;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:28px;padding:52px 0 42px}.canvas-copy{display:flex;flex-direction:column;gap:20px;min-width:0}.eyebrow{font-size:11px;font-weight:600;letter-spacing:.08em;color:var(--soft)}.canvas-copy .eyebrow{color:#e8dff299}
h1{font-size:clamp(34px,3.1vw,58px);font-weight:750;line-height:1.2;letter-spacing:-.04em}h1 span{display:block;white-space:nowrap}h1 span+span{margin-top:8px}.canvas-copy p{max-width:370px;font-size:14px;line-height:1.85;color:#e8dff2a8}
.login-dial{position:relative;width:clamp(180px,17vw,300px);aspect-ratio:1}.login-dial svg{width:100%;height:100%;overflow:visible}.dial-tick{stroke:#ffffff26;stroke-width:.7;transition:stroke .35s}.dial-tick.major{stroke-width:1.1;stroke:#ffffff4d}.dial-tick.on{stroke:var(--primary-light)}.dial-center{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px}.dial-time{font:600 clamp(24px,2.3vw,34px) ui-monospace,SFMono-Regular,Menlo,monospace;font-variant-numeric:tabular-nums;letter-spacing:-.04em}.dial-date{font:10px ui-monospace,SFMono-Regular,Menlo,monospace;color:#e8dff280}
.cap-list{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 24px;padding:24px;border:1px solid #ffffff19;border-radius:18px;background:#ffffff0b;box-shadow:inset 0 1px 0 #ffffff12,0 12px 30px #00000018;backdrop-filter:blur(18px)}.cap-item{display:flex;align-items:flex-start;gap:12px;min-width:0}.cap-ico{display:grid;place-items:center;width:32px;height:32px;flex:none;border-radius:8px;background:#b899df1f;color:#cdb0f3;font:11px ui-monospace,monospace}.cap-item strong{display:block;font-size:13px;font-weight:600}.cap-item div>span{display:block;margin-top:4px;color:#e8dff280;font-size:11px;line-height:1.5}
.login-side{position:relative;display:grid;place-items:center;padding:90px clamp(20px,4vw,64px) 50px;min-width:0}.login-side:before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(50% 40% at 50% 30%,#ffffffcc,transparent 70%),radial-gradient(45% 40% at 80% 85%,#bca4d829,transparent 70%)}
.card-entrance{width:100%;max-width:420px;position:relative;z-index:2;perspective:1200px}.login-card{position:relative;width:100%;border:1px solid var(--line);border-radius:24px;background:linear-gradient(145deg,#fffffff5,#fcfafff7);box-shadow:inset 0 1px 0 #fff,0 16px 40px #3924470b,0 2px 5px #3924470a;transform:rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg));transition:transform .6s cubic-bezier(.2,.8,.2,1);transform-style:preserve-3d}
.glow-layer{position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(circle 120px at var(--glow-x,50%) var(--glow-y,30%),#ffffffe6,#c5a8ee14 42%,transparent 72%);mix-blend-mode:screen;opacity:0;transition:opacity .28s}.login-card:hover .glow-layer{opacity:.72}.login-card-inner{position:relative;padding:32px}.login-card h2{margin-top:8px;font-size:28px;font-weight:740;letter-spacing:-.03em}.login-card-sub{font-size:13px;color:var(--soft);margin-top:6px;line-height:1.6}.mobile-brand{display:none}
.login-form{display:flex;flex-direction:column;gap:18px;margin-top:28px}.field{display:flex;flex-direction:column;gap:8px}.field>label{font-size:13px;font-weight:600}.input-shell{display:flex;align-items:center;gap:10px;height:44px;border:1px solid var(--line);border-radius:10px;padding:0 12px;background:#f9f8fb;box-shadow:inset 0 2px 3px #33213e05;transition:border-color .2s,box-shadow .2s}.input-shell:focus-within{border-color:var(--primary);box-shadow:0 0 0 3px #7952b31a}.input-shell>svg{width:16px;height:16px;flex:none;color:#9a8da8}.input-shell input{width:100%;min-width:0;border:0;outline:none;background:transparent;font-size:13px;color:var(--ink);height:100%}.input-shell input::placeholder{color:#aca3b7}.input-shell input:focus-visible{outline:none}.password-toggle{display:grid;place-items:center;flex:none;width:30px;height:32px;padding:6px;margin-right:-7px;border:0;border-radius:6px;background:transparent;color:#8e809e}.password-toggle:hover{background:#7952b312;color:var(--primary)}.password-toggle svg{width:17px;height:17px}.field-error{display:none;color:#ad4055;font-size:12px}.field:has([aria-invalid="true"]) .input-shell{border-color:#b84760}.field:has([aria-invalid="true"]) .field-error{display:block}.remember{display:flex;gap:8px;align-items:center;font-size:12px;color:#74677e;cursor:pointer;width:fit-content}.remember{position:relative;user-select:none}.remember input{position:absolute;opacity:0;width:1px;height:1px}.checkbox-box{display:grid;place-items:center;width:17px;height:17px;flex:none;border:1.5px solid #9f94ad;border-radius:5px;background:#f9f8fb;transition:background .18s,border-color .18s,box-shadow .18s}.checkbox-box svg{width:12px;height:12px;stroke-width:2.6;color:white;visibility:hidden}.remember:hover .checkbox-box{border-color:var(--primary)}.remember input:checked+.checkbox-box{background:var(--primary);border-color:var(--primary);box-shadow:0 2px 6px #7952b347}.remember input:checked+.checkbox-box svg{visibility:visible}.remember input:focus-visible+.checkbox-box{outline:2px solid #b99adb;outline-offset:3px}
.login-error{padding:11px 12px;border-radius:9px;font-size:12px;line-height:1.6;color:#9b344b;background:#faedf0}.login-submit-slot{display:flex;justify-content:center;min-height:46px;margin-top:4px}.login-submit{position:relative;transform-origin:50% 68%;display:flex;align-items:center;justify-content:center;gap:8px;width:100%;height:46px;border:1px solid #6b429d;border-radius:12px;background:var(--primary);color:#fff;font-size:14px;font-weight:600;box-shadow:inset 0 1px 0 #ffffff26,0 5px 12px #7952b324;transition:background .2s,box-shadow .2s}.login-submit:hover:not(:disabled){background:#6d45a5;box-shadow:inset 0 1px 0 #ffffff26,0 7px 18px #7952b336}.login-submit:disabled{opacity:.7}.spinner{width:15px;height:15px;border:2px solid #ffffff50;border-top-color:#fff;border-radius:50%;animation:spin .7s linear infinite}.success-orb{display:flex;align-items:center;justify-content:center;height:46px;width:46px;border-radius:999px;background:var(--primary);color:#fff;box-shadow:0 5px 16px #7952b32e}.success-orb circle{stroke:#ffffff8c;stroke-width:2.4;stroke-dasharray:126;transform:rotate(-90deg);transform-origin:50% 50%}.success-orb path{stroke-width:3;stroke-dasharray:24}
@keyframes spin{to{transform:rotate(360deg)}}
@media(max-width:1280px){.canvas-main{grid-template-columns:minmax(0,1fr)}.login-dial{display:none}.canvas-copy{gap:22px}.login-title{font-size:46px}}
@media(max-width:960px){.login{grid-template-columns:minmax(0,1fr);padding:0}.login-canvas{display:none}.login-side{min-height:100dvh;padding:32px 16px}.mobile-brand{display:flex;align-items:center;gap:10px;font-size:17px;font-weight:700;margin-bottom:28px}}
@media(max-width:400px){.login-card-inner{padding:26px 22px}.login-card{border-radius:20px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.login-card{transform:none}}

.ripple-clip{position:absolute;inset:0;overflow:hidden;border-radius:inherit;pointer-events:none}.ripple-dot{position:absolute;width:20px;height:20px;translate:-50% -50%;border-radius:50%;background:#ffffff40;pointer-events:none}
@media(pointer:coarse),(prefers-reduced-motion:reduce){.glow-layer{display:none}}
