/* Local Wheelint portal login design. */
*{box-sizing:border-box}
body{margin:0;color:var(--foreground);font-family:Arial,Helvetica,sans-serif}
input,button{font:inherit}
button{border:0;cursor:pointer}
svg{vertical-align:middle}

:root{--background:oklch(25.2% .065 258);--foreground:oklch(16% .008 260);--primary:oklch(47.5% .283 264);--primary-foreground:oklch(100% 0 0);--ring:oklch(64% .14 254);--login-panel-light:oklch(98.5% .012 245);--login-panel-blue:oklch(89% .055 252);--login-card:oklch(97.7% .015 252);--login-field:oklch(99.4% .003 260);--login-border:oklch(88.5% .019 256);--login-muted:oklch(57% .043 280);--login-focus:var(--primary);--login-wheel:oklch(73.3% .081 249);--login-streak:oklch(62% .08 249);--login-panel-gradient:linear-gradient(105deg, var(--login-panel-blue), var(--login-panel-light) 67%);--login-card-gradient:linear-gradient(135deg, var(--login-panel-light), var(--login-card));--login-screen-gradient:radial-gradient(ellipse at 48% 18%, oklch(29% .07 258), var(--background) 85%);--login-panel-shadow:0 18px 40px oklch(12% .06 259/.55);--login-card-shadow:0 5px 20px oklch(71% .12 239/.35), 0 0 24px oklch(78% .09 242/.22);--login-button-shadow:0 3px 9px oklch(57% .17 251/.32)}
.wheelint-screen{background:var(--login-screen-gradient);letter-spacing:0;place-items:center;min-height:100svh;padding:40px 24px;font-family:Arial,Helvetica,sans-serif;display:grid;position:relative;overflow:hidden}
.wheelint-streaks{pointer-events:none;position:absolute;inset:0;overflow:hidden}
.wheelint-streaks span{opacity:.42;filter:blur(1px);background:linear-gradient(transparent, var(--login-streak), transparent);width:5px;height:110px;animation:wheelint-fall calc(var(--fall-duration,16s) / 2) linear var(--fall-delay,0s) infinite;border-radius:50%;position:absolute;top:-120px}
.wheelint-streaks span:first-child{--fall-duration:17s;--fall-delay:-5s;left:2%}
.wheelint-streaks span:nth-child(2){--fall-duration:14s;--fall-delay:-2s;left:8%}
.wheelint-streaks span:nth-child(3){--fall-duration:19s;--fall-delay:-10s;left:10%}
.wheelint-streaks span:nth-child(4){--fall-duration:16s;--fall-delay:-1s;left:16%}
.wheelint-streaks span:nth-child(5){--fall-duration:18s;--fall-delay:-16s;left:20%}
.wheelint-streaks span:nth-child(6){--fall-duration:15s;--fall-delay:-3s;left:38%}
.wheelint-streaks span:nth-child(7){--fall-duration:20s;--fall-delay:-18s;left:42%}
.wheelint-streaks span:nth-child(8){--fall-duration:17s;--fall-delay:-2s;left:67%}
.wheelint-streaks span:nth-child(9){--fall-duration:14s;--fall-delay:-11s;left:72%}
.wheelint-streaks span:nth-child(10){--fall-duration:19s;--fall-delay:-4s;left:88%}
.wheelint-streaks span:nth-child(11){--fall-duration:16s;--fall-delay:-6s;left:92%}
.wheelint-streaks span:nth-child(12){--fall-duration:18s;--fall-delay:-13s;left:96%}
.wheelint-streaks span:nth-child(13){--fall-duration:15s;--fall-delay:-3s;left:98%}
.wheelint-streaks span:nth-child(14){--fall-duration:20s;--fall-delay:-15s;left:5%}
.wheelint-streaks span:nth-child(15){--fall-duration:17s;--fall-delay:-14s;left:88%}
.wheelint-streaks span:nth-child(16){--fall-duration:18s;--fall-delay:-1s;left:3%}
.wheelint-streaks span:nth-child(17){--fall-duration:16s;--fall-delay:-4s;left:12%}
.wheelint-streaks span:nth-child(18){--fall-duration:20s;--fall-delay:-6s;left:24%}
.wheelint-streaks span:nth-child(19){--fall-duration:17s;--fall-delay:-3s;left:30%}
.wheelint-streaks span:nth-child(20){--fall-duration:15s;--fall-delay:-5s;left:35%}
.wheelint-streaks span:nth-child(21){--fall-duration:19s;--fall-delay:-1s;left:45%}
.wheelint-streaks span:nth-child(22){--fall-duration:18s;--fall-delay:-7s;left:51%}
.wheelint-streaks span:nth-child(23){--fall-duration:16s;--fall-delay:-2s;left:57%}
.wheelint-streaks span:nth-child(24){--fall-duration:20s;--fall-delay:-8s;left:63%}
.wheelint-streaks span:nth-child(25){--fall-duration:17s;--fall-delay:-4s;left:69%}
.wheelint-streaks span:nth-child(26){--fall-duration:15s;--fall-delay:-2s;left:77%}
.wheelint-streaks span:nth-child(27){--fall-duration:19s;--fall-delay:-6s;left:82%}
.wheelint-streaks span:nth-child(28){--fall-duration:18s;--fall-delay:-1s;left:90%}
.wheelint-streaks span:nth-child(29){--fall-duration:16s;--fall-delay:-7s;left:94%}
.wheelint-streaks span:nth-child(30){--fall-duration:20s;--fall-delay:-4s;left:99%}
.wheelint-panel{border:1px solid var(--login-panel-light);background:var(--login-panel-gradient);width:min(1240px,100%);min-height:700px;box-shadow:var(--login-panel-shadow);border-radius:30px;justify-content:flex-end;align-items:center;padding:62px 52px 46px;animation:.95s cubic-bezier(.16,1,.3,1) both wheelint-panel-enter;display:flex;position:relative;overflow:hidden}
.wheelint-wheel{width:860px;height:860px;color:var(--login-wheel);transform-origin:50%;pointer-events:none;animation:60s linear infinite wheelint-turn;position:absolute;top:-74px;left:-452px}
.wheel-outline{fill:none;stroke:currentColor;stroke-width:1.5px;opacity:.6}
.wheel-ring{fill:none;stroke:currentColor;stroke-width:29px}
.wheel-segments{fill:none;stroke:currentColor;stroke-width:90px}
.wheel-hub,.wheel-cog{fill:currentColor}
.wheelint-card{border:1px solid var(--login-panel-light);background:var(--login-card-gradient);width:min(566px,100%);min-width:0;min-height:560px;box-shadow:var(--login-card-shadow);border-radius:28px;padding:32px 48px;animation:.85s cubic-bezier(.16,1,.3,1) .18s both wheelint-card-enter;position:relative}
.wheelint-screen:not(.wheelint-motion-ready) .wheelint-panel,.wheelint-screen:not(.wheelint-motion-ready) .wheelint-card{animation:none}
.wheelint-motion-ready .wheelint-panel{animation-duration:1.4s}
.wheelint-motion-ready .wheelint-card{animation-duration:1.1s;animation-delay:.25s}
.wheelint-logo{mix-blend-mode:multiply;width:452px;max-width:100%;height:auto;margin:0 auto 16px;display:block}
.wheelint-field{min-width:0;margin-bottom:18px}
.wheelint-field label{margin-bottom:6px;font-size:13px;font-weight:600;line-height:16px;display:block}
.wheelint-input-wrap{position:relative}
.wheelint-input{border:1px solid var(--login-border);background:var(--login-field);height:46px;box-shadow:none;color:var(--foreground);border-radius:8px;padding:0 47px;font-size:13px}
.wheelint-input::placeholder{color:var(--login-muted);opacity:1}
.wheelint-leading-icon,.wheelint-trailing-icon{width:19px;height:19px;color:var(--login-muted);pointer-events:none;position:absolute;top:50%;transform:translateY(-50%)}
.wheelint-leading-icon{left:15px}
.wheelint-trailing-icon{right:16px}
.wheelint-visibility{width:36px;height:36px;color:var(--login-muted);background:0 0;padding:0;position:absolute;top:5px;right:7px}
.wheelint-visibility svg{width:19px;height:19px}
.wheelint-password-field{margin-bottom:12px}
.wheelint-options{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px;min-height:18px;margin-bottom:16px;display:grid}
.wheelint-remember{align-items:center;gap:8px;min-width:0;font-size:13px;line-height:18px;display:flex}
.wheelint-remember input{appearance:none;border:1.5px solid var(--login-muted);background:var(--login-field);cursor:pointer;border-radius:3px;flex-shrink:0;width:17px;height:17px;margin:0}
.wheelint-link{color:var(--primary);background:0 0;border-radius:2px;height:auto;padding:0;font-size:13px;font-weight:600;line-height:18px}
.wheelint-login-button{background:var(--primary);height:50px;color:var(--primary-foreground);box-shadow:var(--login-button-shadow);border-radius:8px;font-size:17px;font-weight:400}
.wheelint-divider{background:var(--login-border);height:1px;margin:18px 0 17px}
.wheelint-signup{color:var(--login-muted);grid-template-columns:minmax(0,auto) auto;justify-content:center;align-items:center;gap:7px;font-size:13px;line-height:18px;display:grid}
.wheelint-signup>span{min-width:0}
.wheelint-options>.wheelint-link,.wheelint-signup>.wheelint-link{flex-shrink:0}
.wheelint-input:focus-visible,.wheelint-remember input:focus-visible,.wheelint-link:focus-visible,.wheelint-visibility:focus-visible,.wheelint-login-button:focus-visible{outline:2px solid var(--login-focus);outline-offset:3px}
.wheelint-input:focus-visible{border-color:var(--login-focus)}
.wheelint-link:focus-visible{text-underline-offset:3px;text-decoration:underline}
@keyframes wheelint-turn{to{transform:rotate(360deg)}
}
@keyframes wheelint-fall{0%{transform:translateY(0)}
to{transform:translateY(calc(100svh + 240px))}
}
@keyframes wheelint-panel-enter{0%{opacity:0;transform:translateY(45px)scale(.95)}
to{opacity:1;transform:translateY(0)scale(1)}
}
@keyframes wheelint-card-enter{0%{opacity:0;transform:translateY(14px)}
to{opacity:1;transform:translateY(0)}
}
@media (width<=800px){.wheelint-panel{justify-content:center;min-height:640px;padding:40px 30px}
.wheelint-wheel{opacity:.25;left:-560px}
}
@media (width<=540px){.wheelint-screen{padding:24px 12px}
.wheelint-panel{border-radius:24px;min-height:0;padding:66px 10px 20px}
.wheelint-wheel{opacity:.65;width:400px;height:400px;display:block;top:-180px;left:-155px}
.wheelint-card{border-radius:22px;width:100%;min-height:0;padding:24px 16px}
.wheelint-logo{margin-bottom:18px}
.wheelint-input{padding-left:40px;padding-right:40px;font-size:16px}
.wheelint-input::placeholder,.wheelint-link,.wheelint-remember,.wheelint-signup{font-size:12px}
.wheelint-remember{gap:6px}
}

.wheelint-input{width:100%;display:block;outline:none}
.wheelint-visibility{display:grid;place-items:center;border:0;cursor:pointer}
.wheelint-login-button{width:100%;border:0;cursor:pointer;display:block}
.wheelint-login-button:hover{filter:brightness(.94)}
.wheelint-login-button:disabled{opacity:.65;cursor:wait}
.wheelint-remember input{appearance:auto;accent-color:var(--primary)}

.input-error,#recaptchaError{color:#b42318;font-size:13px;line-height:1.6}
.input-error{display:flex;align-items:center;gap:8px;margin-bottom:14px}
.input-error:empty{display:none}
.input-error img{width:16px;height:16px}
.wheelint-input.error{border-color:#b42318}
.wheelint-footer{text-align:center;color:var(--login-muted);font-size:12px;margin:18px 0 0}
.wheelint-logo-slot .wheelint-logo{object-fit:contain}
.wheelint-brand-logo{max-height:165px;object-fit:contain}

@media(prefers-reduced-motion:reduce){.wheelint-panel,.wheelint-card,.wheelint-wheel,.wheelint-streaks span{animation:none!important}
}

