/* login-blend-css - The sign-in screen blended into the landing page behind it. */

#login{background:radial-gradient(880px 520px at 12% -12%,rgba(255,194,31,.3),transparent 62%),radial-gradient(760px 460px at 96% 112%,rgba(20,22,26,.65),transparent 60%),linear-gradient(158deg,#15171b,#23272e 58%,#1c1f24)}
.lc{background:#fff;border:1px solid rgba(255,255,255,.72);border-radius:22px;box-shadow:0 34px 90px rgba(10,11,13,.42);color:#1f2226}
.lc h1{color:#1c1f24;letter-spacing:-.02em}
.lc label{color:#1c1f24}
.lc .crumb{color:#6c6a63}
.lc input{background:#fbfaf5;border:1px solid #e5e1d6;border-radius:12px;color:#1f2226}
.lc input:focus{outline:0;border-color:#9a6a00;box-shadow:0 0 0 3px rgba(255,194,31,.18)}
.lc .btn{background:#ffc21f;border:1px solid #e8ab0e;color:#1c1f24;border-radius:12px;min-height:48px;font-weight:700;box-shadow:0 10px 24px rgba(255,194,31,.35);transition:background .2s,box-shadow .2s,transform .2s}
.lc .btn:hover{background:#e8ab0e;box-shadow:0 14px 28px rgba(232,171,14,.4)}
.lc .btn:focus-visible{outline:3px solid #e3ae4a;outline-offset:3px}
.lc .lk{color:#9a6a00;text-decoration-thickness:1px;text-underline-offset:2px}
.lc .lk:hover{color:#7a5200}
.lp-help a{color:#9a6a00}
/* the show/hide control carries an inline colour from bridge.js, so it needs the same weight to blend */
.lc .pw-eye{color:#9a6a00 !important}
.lc .back{color:#6c6a63}
.lbrand b{color:#1c1f24}
.lbrand small{color:#9a6a00;opacity:1}
.lbrand svg{border-radius:14px;box-shadow:0 8px 22px rgba(255,194,31,.24)}
@media (prefers-reduced-motion:reduce){.lc .btn{transition:none}.lc .btn:hover{transform:none}}
:root[data-theme=dark] #login,:root:not([data-theme=light]) #login{background:radial-gradient(880px 520px at 12% -12%,rgba(255,194,31,.22),transparent 62%),radial-gradient(760px 460px at 96% 112%,rgba(0,0,0,.6),transparent 60%),linear-gradient(158deg,#0c0d0f,#17191d 68%,#101214)}
:root[data-theme=dark] .lc,:root:not([data-theme=light]) .lc{background:rgba(18,18,20,.88);border-color:rgba(255,255,255,.1);color:#f0efe9}
:root[data-theme=dark] .lc h1,:root:not([data-theme=light]) .lc h1{color:#f5f4ee}
:root[data-theme=dark] .lc label,:root:not([data-theme=light]) .lc label{color:#d8d5cb}
:root[data-theme=dark] .lc .crumb,:root:not([data-theme=light]) .lc .crumb{color:#9d9a91}
:root[data-theme=dark] .lc input,:root:not([data-theme=light]) .lc input{background:#141417;border-color:#3a3a40;color:#f0efe9}
:root[data-theme=dark] .lc input:focus,:root:not([data-theme=light]) .lc input:focus{outline:0;border-color:#ffd45c;box-shadow:0 0 0 3px rgba(255,212,92,.3)}
:root[data-theme=dark] .lc .btn,:root:not([data-theme=light]) .lc .btn{background:#ffc21f;border-color:#e8ab0e;color:#17140a}
:root[data-theme=dark] .lc .btn:hover,:root:not([data-theme=light]) .lc .btn:hover{background:#ffd45c}
:root[data-theme=dark] #lb,:root:not([data-theme=light]) #lb{background:linear-gradient(135deg,#ffd45c,#e8ab0e);border-color:transparent;color:#17140a;box-shadow:0 10px 26px rgba(232,171,14,.45)}
:root[data-theme=dark] .lc .lk,:root:not([data-theme=light]) .lc .lk{color:#ffd45c}
:root[data-theme=dark] .lp-help a,:root:not([data-theme=light]) .lp-help a{color:#ffd45c}
:root[data-theme=dark] .lc .pw-eye,:root:not([data-theme=light]) .lc .pw-eye{color:#ffd45c !important}
:root[data-theme=dark] .lbrand b,:root:not([data-theme=light]) .lbrand b{color:#f5f4ee}
:root[data-theme=dark] .lbrand small,:root:not([data-theme=light]) .lbrand small{color:#ffd45c}
