:root {color-scheme:dark;font-family:Inter,"Segoe UI",system-ui,-apple-system,BlinkMacSystemFont,Arial,sans-serif;color:#f1f1fc;background:#111624}
* {box-sizing:border-box}
body {margin:0;min-height:100dvh;display:grid;place-items:center;padding:32px;background:radial-gradient(ellipse at 20% 10%,#38295050,transparent 55%),#111624;font-size:14px;line-height:1.5}
button,input {font:inherit}
button {cursor:pointer}
.login-shell {width:100%;max-width:1050px;min-height:625px;display:grid;grid-template-columns:1.12fr 1fr;border:1px solid #44425e;border-radius:24px;overflow:hidden;background:#1b2135;box-shadow:0 35px 100px #0004}
.login-story {position:relative;padding:34px 38px 27px;background:radial-gradient(ellipse at 0% 0%,#8f5cb340,transparent 55%),linear-gradient(150deg,#362b50,#272641 65%,#21374a);display:flex;flex-direction:column;border-right:1px solid #4e4565;overflow:hidden}
.login-brand {display:flex;align-items:center;gap:10px}
.login-brand-mark {width:43px;height:43px;display:grid;place-items:center;background:linear-gradient(140deg,#ba9cff,#8155d7);border-radius:13px;color:#fff}
.login-brand strong {display:block;font-size:13px;letter-spacing:3px}
.login-brand small {display:block;font-size:8px;letter-spacing:2px;color:#bdb2d5;margin-top:1px}
.studio-version {margin-left:auto;border:1px solid #76618f;background:#514064;font-size:9px;padding:4px 7px;border-radius:5px;color:#ded0f7;letter-spacing:1px;white-space:nowrap}
.login-story-copy {margin-top:57px;position:relative;z-index:1}
.login-eyebrow {display:block;font-size:9px;letter-spacing:1.8px;font-weight:700;color:#c5acef}
.login-story h1 {font-size:clamp(37px,4vw,53px);line-height:1.11;letter-spacing:-1.6px;font-weight:720;margin:16px 0 19px;color:#f8f5ff}
.login-story h1>span {color:#d2b1ff}
.login-story p {font-size:14px;line-height:1.8;color:#c1bcd4;margin:0}
.login-art {width:100%;height:207px;margin-top:11px}
.login-art svg {width:100%;height:100%}
.login-story-footer {display:flex;gap:25px;font-size:11px;color:#c9c4df;margin-top:auto}
.login-story-footer>span {display:flex;align-items:center;gap:7px}
.dot {width:7px;height:7px;display:block;border-radius:50%}.purple {background:#bba3ff}.blue {background:#7dcaff}.green {background:#6bdeb9}
.login-access {padding:55px 43px;display:flex;flex-direction:column;justify-content:center}
.login-access>.login-eyebrow {font-size:9px;letter-spacing:1.3px;color:#ae95dd}
.login-access h2 {font-size:30px;line-height:1.2;letter-spacing:-.7px;margin:14px 0 11px}
.login-description {font-size:13px;color:#aeb9d1;margin:0 0 34px;line-height:1.7}
.form-group {margin-bottom:22px}
label {display:block;font-size:12px;font-weight:600;color:#d1d8eb;margin-bottom:9px}
input {width:100%;height:46px;padding:12px 14px;background:#151b2c;border:1px solid #424c69;border-radius:9px;color:#f3f4ff;outline:0;font-size:14px}
input::placeholder {color:#8f9ab6}
input:focus {border-color:#b298f5;box-shadow:0 0 0 3px #a78bfa20}
.password-field {position:relative}
.password-field input {padding-right:80px}
.password-toggle {position:absolute;right:9px;top:8px;padding:7px 6px;border:0;background:transparent;color:#bea6f4;font-size:11px;border-radius:5px}
.password-toggle:hover {background:#362b51}
.login-submit {display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;padding:13px 16px;min-height:47px;margin-top:10px;background:#b99af6;border:1px solid #c9b0ff;border-radius:9px;color:#20152f;font-size:13px;font-weight:700;transition:background .15s}
.login-submit:hover {background:#c9aaff}
.login-submit>span {font-size:21px;line-height:1}
.login-note {display:flex;align-items:center;justify-content:center;gap:7px;color:#929eb9;font-size:10px;margin-top:25px}
.login-note-dot {width:6px;height:6px;border-radius:50%;background:#69c9aa}
.error-message {border:1px solid #a65065;background:#432838;color:#ffc0cc;border-radius:8px;padding:10px 12px;font-size:12px;margin-bottom:14px}
button:focus-visible {outline:2px solid #d1b7ff;outline-offset:3px}
@media (max-width:850px) {.login-shell {max-width:740px;min-height:580px}.login-story {padding:27px}.login-access {padding:40px 28px}.login-story h1 {font-size:39px}.login-story-copy {margin-top:52px}.studio-version {display:none}.login-story-footer {gap:14px}}
@media (max-width:620px) {body {padding:18px 12px}.login-shell {max-width:440px;grid-template-columns:1fr;border-radius:19px;min-height:0}.login-story {padding:24px;border:0;border-bottom:1px solid #524965}.login-brand-mark {width:37px;height:37px}.login-story-copy {margin-top:26px}.login-story h1 {font-size:35px;margin-top:11px;letter-spacing:-1px}.login-story h1 br {display:none}.login-story p {font-size:12px}.login-story p br {display:none}.login-art,.login-story-footer {display:none}.login-access {padding:30px 24px}.login-access h2 {font-size:27px}.login-description {margin-bottom:25px}.studio-version {display:block;font-size:8px}.login-story-copy>.login-eyebrow {font-size:8px}}
@media (prefers-reduced-motion:reduce) {* {transition:none!important}}