:root { --brand-red:#ff2442; --brand-red-deep:#e91e3b; --ink:#202124; --muted:#77787d; --line:#ececee; --canvas:#f7f7f8; }
body.console-login { min-height:100vh; margin:0; background:var(--canvas); color:var(--ink); }
.console-login #container { min-height:100vh; border:0!important; box-shadow:none!important; background:transparent; }
.console-login #header,.console-login .breadcrumbs,.console-login #nav-sidebar,.console-login #toggle-nav-sidebar,.console-login #content > h1 { display:none; }
.console-login #main,.console-login #content { display:block; width:100%; max-width:none; min-height:100vh; padding:0!important; }
.console-login #main.shifted > #content-start,.console-login #main.shifted > #nav-sidebar + #content { width:100%!important; max-width:100%!important; }
.console-login .login-shell { position:relative; isolation:isolate; display:grid; grid-template-columns:minmax(250px,1fr) minmax(360px,432px); grid-template-rows:auto 1fr auto; column-gap:clamp(60px,11vw,190px); min-height:100vh; overflow:hidden; padding:clamp(30px,4vw,64px) max(32px,calc((100vw - 1410px) / 2)); box-sizing:border-box; }
.login-motion { position:absolute; z-index:-1; inset:0; overflow:hidden; pointer-events:none; }
.motion-grid { position:absolute; inset:0; opacity:.72; background-image:linear-gradient(#e9e9ec 1px,transparent 1px),linear-gradient(90deg,#e9e9ec 1px,transparent 1px); background-size:54px 54px; mask-image:linear-gradient(90deg,#000 0%,rgba(0,0,0,.76) 42%,transparent 74%); }
.motion-line { position:absolute; display:block; width:clamp(420px,54vw,820px); height:1px; background:#ff9dad; transform-origin:left center; opacity:.8; }
.motion-line-one { top:43%; left:-7%; transform:rotate(-22deg); }.motion-line-two { top:68%; left:4%; transform:rotate(18deg); background:#ffd4db; }
.motion-node { position:absolute; width:8px; height:8px; border:2px solid var(--brand-red); border-radius:50%; background:var(--canvas); box-shadow:0 0 0 6px rgba(255,36,66,.08); }
.motion-node-one { top:37%; left:28%; }.motion-node-two { top:60%; left:16%; }.motion-node-three { top:73%; left:43%; }
.motion-ready .motion-line-one { animation:line-drift-one 11s ease-in-out infinite; }.motion-ready .motion-line-two { animation:line-drift-two 14s ease-in-out infinite; }.motion-ready .motion-node { animation:node-pulse 3s ease-in-out infinite; }.motion-ready .motion-node-two { animation-delay:1s; }.motion-ready .motion-node-three { animation-delay:2s; }
.login-brand { grid-column:1 / -1; display:flex; align-items:center; gap:12px; align-self:start; }
.login-brand-mark { display:grid; width:38px; height:42px; place-items:center; flex:none; }
.login-brand-mark img { display:block; width:100%; height:100%; object-fit:contain; }
.login-brand-copy { display:grid; gap:4px; line-height:1; }.login-brand-copy b { color:#303135; font-size:10px; font-weight:700; letter-spacing:.08em; }.login-brand-copy strong { color:#26272a; font-size:15px; font-weight:650; }
.login-intro { grid-column:1; align-self:center; max-width:560px; padding:60px 0 48px; }
.login-overline,.login-panel-kicker { margin:0; color:var(--brand-red); font-size:11px; font-weight:700; letter-spacing:.1em; }
.login-intro h1 { margin:17px 0 20px; color:#1e1f22; font-size:clamp(34px,3.4vw,54px); line-height:1.19; font-weight:700; letter-spacing:0; }
.login-intro > p:not(.login-overline) { max-width:380px; margin:0; color:#717278; font-size:15px; line-height:1.8; }
.login-intro-meta { display:flex; flex-wrap:wrap; gap:9px 0; margin-top:34px; }.login-intro-meta span { padding:0 16px; border-right:1px solid #d8d8dc; color:#4f5055; font-size:12px; line-height:1; }.login-intro-meta span:first-child { padding-left:0; }.login-intro-meta span:last-child { border-right:0; }
.login-panel { grid-column:2; grid-row:2; align-self:center; box-sizing:border-box; width:100%; padding:clamp(31px,3.3vw,46px); border:1px solid #ededee; border-radius:8px; background:#fff; box-shadow:0 20px 56px rgba(31,26,27,.08); }
.login-panel-header { padding-bottom:28px; border-bottom:1px solid var(--line); }.login-panel-header h2 { margin:11px 0 9px; color:#202124; font-size:28px; font-weight:700; line-height:1.25; }.login-panel-header > p:last-child { margin:0; color:#85868b; font-size:13px; line-height:1.6; }
.console-login #login-form { margin-top:28px; }.login-field { margin-bottom:20px; }.login-field label { display:block; margin-bottom:9px; color:#3e3f43; font-size:13px; font-weight:600; }
.login-field input { box-sizing:border-box; width:100%; min-height:50px; border:1px solid #e1e1e4!important; border-radius:5px!important; padding:11px 13px!important; background:#fff; color:#202124; font-size:15px; outline:none; transition:border-color .18s ease,box-shadow .18s ease; }.login-field input::placeholder { color:#b7b7bc; }.login-field input:focus { border-color:var(--brand-red)!important; box-shadow:0 0 0 3px rgba(255,36,66,.12); }
.login-submit { display:flex; width:100%; min-height:52px; align-items:center; justify-content:space-between; border:0; border-radius:5px; padding:0 17px 0 19px; background:var(--brand-red); color:#fff; font:inherit; font-size:15px; font-weight:650; cursor:pointer; transition:background .18s ease,transform .18s ease,box-shadow .18s ease; }.login-submit:hover { background:var(--brand-red-deep); transform:translateY(-1px); box-shadow:0 7px 16px rgba(255,36,66,.22); }.login-submit:focus-visible { outline:3px solid rgba(255,36,66,.28); outline-offset:3px; }.login-submit svg { width:18px; height:18px; }
.login-alert { margin:25px 0 -4px; padding:11px 13px; border:1px solid #ffd5db; border-left:3px solid var(--brand-red); border-radius:4px; background:#fff5f6; color:#bf1934; font-size:13px; line-height:1.55; }
.login-panel-footer { display:flex; justify-content:space-between; gap:16px; margin-top:27px; color:#999aa0; font-size:11px; line-height:1.45; }.login-panel-footer a { color:#68696e; text-decoration:none; }.login-panel-footer a:hover { color:var(--brand-red); }
.login-copyright { grid-column:1 / -1; margin:0; align-self:end; color:#a0a1a6; font-size:10px; font-weight:650; letter-spacing:.1em; }
@keyframes line-drift-one { 0%,100% { transform:rotate(-22deg) translateX(-2%); opacity:.45; } 50% { transform:rotate(-22deg) translateX(7%); opacity:.9; } }
@keyframes line-drift-two { 0%,100% { transform:rotate(18deg) translateX(0); opacity:.28; } 50% { transform:rotate(18deg) translateX(-8%); opacity:.72; } }
@keyframes node-pulse { 0%,100% { transform:scale(1); box-shadow:0 0 0 6px rgba(255,36,66,.08); } 50% { transform:scale(1.18); box-shadow:0 0 0 12px rgba(255,36,66,0); } }
@media (max-width:820px) { .console-login .login-shell { display:block; min-height:100dvh; padding:30px 24px 28px; }.motion-grid { mask-image:none; opacity:.48; }.motion-line-one { top:55%; left:-32%; }.motion-line-two { top:73%; left:-25%; }.login-intro { padding:68px 0 38px; }.login-intro h1 { font-size:34px; }.login-panel { padding:30px 26px; }.login-copyright { margin-top:46px; }.login-intro-meta { margin-top:28px; } }
@media (max-width:430px) { .console-login .login-shell { padding:24px 18px; }.login-brand-mark { width:34px; height:38px; }.login-brand-copy strong { font-size:14px; }.login-intro { padding:56px 0 30px; }.login-intro h1 { font-size:30px; }.login-panel { padding:27px 21px; }.login-panel-header h2 { font-size:25px; }.login-intro-meta span { padding:0 11px; font-size:11px; } }
@media (prefers-reduced-motion:reduce) { .motion-line,.motion-node,.login-submit,.login-field input { transition:none; animation:none!important; } }