/* Details for the shared login page; submit feedback keeps its own animation. */
body.login-page .login-card{
    border-color:rgba(166,125,238,.28);
    background:radial-gradient(ellipse at 50% 0,rgba(166,84,234,.09),transparent 55%),linear-gradient(145deg,#111725,#0b0f1b);
    box-shadow:0 28px 80px rgba(0,0,0,.42),inset 0 1px rgba(223,195,255,.06);
}
.login-page .login-brand{margin-bottom:28px}
.login-page .brand-mark{
    position:relative;isolation:isolate;background:linear-gradient(145deg,#b15dea,#7343cb);
    border:1px solid rgba(233,200,255,.3);box-shadow:0 8px 28px rgba(169,79,231,.24);
    overflow:hidden;
}
.login-page .brand-mark::before{content:"";position:absolute;z-index:0;inset:-12px;border-radius:inherit;background:radial-gradient(circle,rgba(215,158,255,.42),transparent 66%);opacity:.55}.login-page .brand-mark::after{content:"";position:absolute;z-index:2;inset:-40% auto -40% -58%;width:42%;pointer-events:none;background:linear-gradient(90deg,transparent,rgba(255,255,255,.48),transparent);transform:rotate(18deg) translateX(-160%)}.login-page .brand-mark svg{position:relative;z-index:1;filter:drop-shadow(0 2px 3px rgba(53,18,111,.22))}
.login-page .login-brand .brand-title{
    font-size:clamp(23px,5.5vw,30px);font-weight:700;line-height:1.25;
    letter-spacing:.5px;overflow-wrap:anywhere;
    color:#f4ecff;text-shadow:0 2px 22px rgba(194,120,255,.12);
}
.login-brand-accent{display:flex;align-items:center;justify-content:center;gap:10px;width:min(230px,80%);height:20px;margin:10px auto 8px}
.login-brand-accent span{position:relative;flex:1;height:1px;overflow:hidden;background:linear-gradient(90deg,transparent,rgba(197,113,255,.6))}
.login-brand-accent span:last-child{transform:rotate(180deg)}
.login-brand-accent span::after{content:"";position:absolute;inset:0;width:45%;background:linear-gradient(90deg,transparent,#94eaff,transparent);transform:translateX(-110%)}
.login-brand-accent i{width:6px;height:6px;flex:0 0 6px;border-radius:2px;background:#cf96ff;transform:rotate(45deg);box-shadow:0 0 12px rgba(197,113,255,.6)}
.login-page .login-brand p{margin:0;color:#a9b6cb;font-size:12px;line-height:1.6;letter-spacing:.35px}.login-security-heading{display:flex;align-items:center;flex-direction:column;gap:9px}.login-page .login-subtitle{display:inline-flex;align-items:center;justify-content:center;gap:7px}.login-subtitle-emoji{display:grid;place-items:center;width:30px;height:26px;border:1px solid rgba(167,141,255,.34);border-radius:0 14px 14px 0;background:linear-gradient(100deg,rgba(83,62,159,.34),rgba(34,40,76,.16));box-shadow:inset 0 1px rgba(255,255,255,.08),0 0 14px rgba(131,100,238,.15);color:#ffd34e;line-height:1}.login-subtitle-emoji svg{width:15px;height:15px;stroke-width:2.4}.login-security-badge{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:8px 14px;border:1px solid rgba(210,113,255,.52);border-radius:8px;background:linear-gradient(105deg,rgba(159,65,212,.19),rgba(70,39,113,.16));box-shadow:inset 0 1px rgba(255,255,255,.09),0 0 16px rgba(190,77,248,.12);color:#d86dff;font-size:12px;font-weight:600;letter-spacing:.15px}.login-security-badge svg{width:16px;height:16px;stroke-width:2.6;color:#d86dff}
.login-page .form-field{margin-bottom:20px}
.login-page .form-field label{color:#c6d0e1;font-weight:600}
.login-page .input-wrap{position:relative;border-radius:12px}
body.login-page .input-wrap input{
    height:50px;border-radius:12px;border-color:#354158;background:#182132;color:#edf3ff;
    caret-color:#d88fff;transition:border-color .2s,box-shadow .2s,background .2s;
}
.login-page .input-wrap input::placeholder{color:#8c9ab1}
.login-page .input-wrap input:hover{border-color:#65708d}
.login-page .input-wrap input:focus{background:#1b2337;border-color:#c784f5;box-shadow:0 0 0 3px rgba(193,111,251,.12),0 5px 22px rgba(125,70,181,.1)}
.login-page .input-wrap>svg{z-index:1;color:#94a2ba;transition:color .2s,filter .2s}
.login-page .input-wrap:focus-within>svg{color:#d9a3ff;filter:drop-shadow(0 0 5px rgba(200,130,255,.35))}
.login-page .password-toggle{z-index:2;top:7px;color:#9eabc1}
.login-page .password-toggle:hover,.login-page .password-toggle:focus-visible{background:rgba(200,130,255,.12);color:#e1b4ff}
.login-page .password-toggle:focus-visible{outline:2px solid #c784f5;outline-offset:1px}
.login-page .login-form>.login-button{
    position:relative;isolation:isolate;overflow:hidden;height:50px;border-radius:12px;
    border:1px solid rgba(233,198,255,.5);font-size:13px;letter-spacing:1.5px;
}
.login-page .login-form>.login-button:not(.is-authenticating){
    background:linear-gradient(110deg,#a64bd0,#c766ed,#a64bd0);background-size:200% 100%;
    box-shadow:0 9px 25px rgba(180,73,226,.25),inset 0 1px rgba(255,255,255,.14);
}
.login-page .login-form>.login-button:not(.is-authenticating)::before{
    content:"";position:absolute;inset:0;pointer-events:none;
    background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.22) 50%,transparent 70%);
    transform:translateX(-110%);
}
.login-page .login-form>.login-button>*{position:relative;z-index:1}
.login-page .login-form>.login-button:not(.is-authenticating):hover{box-shadow:0 12px 30px rgba(180,73,226,.4);border-color:#edcdff}
.login-page .login-form>.login-button:focus-visible{outline:2px solid #efd5ff;outline-offset:4px}
.login-page .login-form>.login-button:not(.is-authenticating):active{transform:translateY(0) scale(.99)}
.login-page .remember-row{gap:12px;flex-wrap:wrap;color:#a1adc1}
.login-page .remember-row input{accent-color:#bd6de6}
.login-page .security-note{flex-wrap:wrap;line-height:1.6}
@media(prefers-reduced-motion:no-preference){
    .login-brand-accent span::after{animation:login-accent-scan 3.2s ease-in-out infinite}
    .login-brand-accent i{animation:login-accent-glow 3.2s ease-in-out infinite}
    .login-page .brand-mark{animation:login-brand-float 3.6s ease-in-out infinite}
    .login-page .brand-mark::before{animation:login-brand-glow 3.6s ease-in-out infinite}
    .login-page .brand-mark::after{animation:login-brand-sheen 4.8s ease-in-out infinite}
    .login-page .brand-mark svg{animation:login-brand-icon 3.6s ease-in-out infinite}
    .login-page .login-brand p{animation:login-subtitle-appear .7s ease-out both}
    .login-subtitle-emoji{animation:login-subtitle-emoji 2.4s ease-in-out infinite}
    .login-security-badge{animation:login-security-badge 3.2s ease-in-out infinite}
    .login-page .input-wrap:focus-within>svg{animation:login-field-icon 2s ease-in-out infinite}
    .login-page .login-form>.login-button:not(.is-authenticating){animation:login-button-gradient 5s ease-in-out infinite}
    .login-page .login-form>.login-button:not(.is-authenticating)::before{animation:login-button-sheen 4.5s ease-in-out infinite}
}
@keyframes login-accent-scan{0%,15%{transform:translateX(-110%)}75%,100%{transform:translateX(330%)}}
@keyframes login-accent-glow{50%{box-shadow:0 0 18px rgba(197,113,255,.85);background:#a0eaff}}
@keyframes login-brand-float{0%,100%{transform:translateY(0);box-shadow:0 8px 28px rgba(169,79,231,.24)}50%{transform:translateY(-5px);box-shadow:0 15px 35px rgba(179,94,247,.42)}}
@keyframes login-brand-glow{0%,100%{opacity:.45;transform:scale(.9)}50%{opacity:.85;transform:scale(1.16)}}
@keyframes login-brand-sheen{0%,55%{transform:rotate(18deg) translateX(-160%)}78%,100%{transform:rotate(18deg) translateX(530%)}}
@keyframes login-brand-icon{50%{transform:scale(1.08) rotate(-3deg)}}
@keyframes login-subtitle-appear{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
@keyframes login-subtitle-emoji{0%,72%,100%{transform:translateY(0) scale(1)}80%{transform:translateY(-2px) rotate(-7deg) scale(1.1);filter:drop-shadow(0 0 5px rgba(190,137,255,.82))}88%{transform:translateY(-1px) rotate(6deg) scale(1.06)}}
@keyframes login-security-badge{0%,100%{border-color:rgba(210,113,255,.46);box-shadow:inset 0 1px rgba(255,255,255,.09),0 0 12px rgba(190,77,248,.1)}50%{border-color:rgba(227,128,255,.78);box-shadow:inset 0 1px rgba(255,255,255,.12),0 0 22px rgba(190,77,248,.26)}}
@keyframes login-field-icon{50%{transform:translateY(-50%) scale(1.1)}}
@keyframes login-button-gradient{50%{background-position:100% 50%}}
@keyframes login-button-sheen{0%,45%{transform:translateX(-110%)}85%,100%{transform:translateX(110%)}}
@media(max-width:575.98px){.login-page .login-brand{margin-bottom:24px}.login-page .login-brand p{font-size:11px}.login-page .remember-row{font-size:11px}}