body.login-page {
    min-height: 100vh;
    background: radial-gradient(circle at 12% 5%, var(--app-canvas) 0, transparent 32%),
        linear-gradient(135deg, var(--app-surface) 0%, var(--app-canvas) 100%);
    color: var(--auth-ink);
    font-family: var(--app-font);
}

.auth-links { display: flex; justify-content: space-between; margin-top: 15px; }
.auth-password-page .titel { margin-bottom: 20px; text-align: center; color: var(--auth-ink); font-size: 20px; font-weight: 700; }
.auth-actions { text-align: center; }
body.login-page .login-logo { text-align: center; }
body.login-page .c-btn { text-align: center; }
body.login-page .forgot-style a { color: var(--app-brand); }
body.login-page .forgot-style a:hover { color: var(--app-brand-dark); }
html[data-theme="dark"] body.login-page .login-logo img { filter: brightness(0) invert(1); }

body.login-page .wrap {
    display: flex;
    min-height: calc(100vh - 48px);
    align-items: center;
    justify-content: center;
    margin: 0;
    padding: 28px 16px;
}

body.login-page .wrap > .container {
    width: 100%;
    padding: 0;
}

body.login-page .logbox {
    width: min(100%, 440px);
    height: auto;
    min-height: 0;
    margin: 0 auto;
    padding: 38px 40px 42px;
    border: 1px solid rgba(225, 230, 238, .9);
    border-radius: 18px;
    background: var(--app-surface);
    box-shadow: 0 18px 50px rgba(31, 48, 83, .1);
}

body.login-page .login-logo {
    margin-bottom: 18px;
}

body.login-page .login-logo img {
    width: 112px !important;
    max-width: 40%;
}

body.login-page .login-box-msg {
    margin: 0 0 24px;
    padding: 0;
    color: var(--auth-ink);
    font-size: 20px;
    font-weight: 700;
    text-align: center;
}

body.login-page div.LoginForm.input {
    height: auto;
    min-height: 0;
    margin: 0 0 16px;
    padding: 0;
    border: 0;
    background: transparent;
}

body.login-page input[type="text"],
body.login-page input[type="password"],
body.login-page input.LoginForm-input,
body.login-page input.LoginForm.input {
    display: block;
    width: 100%;
    height: 48px;
    min-height: 48px;
    margin: 0;
    padding: 12px 14px;
    border: 1px solid var(--auth-line);
    border-radius: 10px;
    background: var(--app-surface);
    box-shadow: none;
    color: var(--auth-ink);
    font-size: 16px;
}

body.login-page input:focus {
    border-color: var(--app-line);
    outline: 0;
    box-shadow: 0 0 0 3px rgba(56, 89, 199, .13);
}

body.login-page .c-btn {
    display: flex;
    width: 100%;
    height: 48px;
    margin-top: 8px;
    border: 0;
    border-radius: 10px;
    background: var(--auth-brand);
    color: var(--app-on-brand);
    font-size: 15px;
    font-weight: 700;
}

body.login-page .c-btn:hover,
body.login-page .c-btn:focus {
    background: var(--app-brand);
    color: var(--app-on-brand);
}

body.login-page .help-block {
    margin-top: 5px;
    color: var(--app-ink);
    font-size: 12px;
}

body.login-page .footer {
    height: 48px;
    padding: 12px 8px 0;
    border-top: 1px solid var(--app-line);
    background: color-mix(in srgb, var(--app-surface) 70%, transparent);
    color: var(--auth-muted);
    font-size: 12px;
}

body.login-page .footer .container {
    width: 100%;
}

@media (max-width: 767px) {
body.login-page .wrap {
    min-height: calc(100vh - 44px);
    padding: 18px 14px;
}

body.login-page .logbox {
    padding: 30px 22px 32px;
    border-radius: 16px;
}

body.login-page .login-box-msg {
    margin-bottom: 20px;
    font-size: 19px;
}

body.login-page .footer {
    height: auto;
    min-height: 44px;
    padding: 10px 4px;
}

body.login-page .footer p {
    margin-bottom: 0;
}

body.login-page .newAlert {
    right: 8px;
    left: 8px;
    bottom: 8px;
}

}

.realdo-login-brand {background:var(--app-brand-dark);color:var(--app-on-brand);}
.realdo-login-brand :is(p,small,.realdo-login-eyebrow,.realdo-login-product,.realdo-login-brand-note) {color:color-mix(in srgb,var(--app-on-brand) 80%,transparent);}
.realdo-login-brand :is(h1,strong,.realdo-login-feature-icon) {color:var(--app-on-brand);}
body.login-page .footer {background:var(--app-surface);color:var(--app-muted);border-color:var(--app-line);}
.app-message-text {white-space:pre-wrap;overflow-wrap:anywhere;}

.realdo-login-logo {background:var(--app-on-brand);}

body.login-page .realdo-login-shell {
    display: grid;
    grid-template-columns: .95fr 1.05fr;
    width: min(100%, 920px);
    min-height: 560px;
    padding: 0;
    overflow: hidden;
    border-color: var(--app-line);
    border-radius: 22px;
    box-shadow: 0 28px 80px rgba(28, 39, 76, .15);
}

body.login-page .realdo-login-brand {
    position: relative;
    display: flex;
    min-height: 100%;
    flex-direction: column;
    justify-content: space-between;
    overflow: hidden;
    padding: 38px 40px 34px;
    isolation: isolate;
}

.realdo-login-brand-top,
.realdo-login-form-heading,
.realdo-login-brand-copy,
.realdo-login-brand-note { position: relative; z-index: 1; }
.realdo-login-brand-top { display: flex; align-items: center; gap: 12px; }
.realdo-login-logo { display: grid; width: 46px; height: 46px; place-items: center; overflow: hidden; border-radius: 12px; }
.realdo-login-logo img { display: block; width: 36px; max-width: 90%; max-height: 36px; object-fit: contain; }
.realdo-login-product { font-size: 10px; font-weight: 750; letter-spacing: .16em; }
.realdo-login-brand-copy { max-width: 330px; margin: auto 0; padding: 52px 0; }
.realdo-login-eyebrow { display: block; color: var(--app-brand); font-size: 10px; font-weight: 750; letter-spacing: .16em; }
.realdo-login-brand-copy .realdo-login-eyebrow { color: color-mix(in srgb, var(--app-on-brand) 68%, transparent); }
.realdo-login-brand-copy h1 { margin: 15px 0 12px; color: var(--app-on-brand); font-size: clamp(32px, 4vw, 44px); font-weight: 750; letter-spacing: -.045em; line-height: 1.08; }
.realdo-login-brand-copy p { max-width: 290px; margin: 0; color: color-mix(in srgb, var(--app-on-brand) 78%, transparent); font-size: 14px; line-height: 1.7; }
.realdo-login-brand-note { display: flex; align-items: center; gap: 9px; font-size: 11px; font-weight: 600; }
.realdo-login-brand-dot { width: 7px; height: 7px; border-radius: 50%; background: #71e0b2; box-shadow: 0 0 0 4px rgba(113, 224, 178, .15); }
.realdo-login-orbit { position: absolute; z-index: -1; display: block; border: 1px solid rgba(255,255,255,.12); border-radius: 50%; pointer-events: none; }
.realdo-login-orbit-one { right: -150px; bottom: 45px; width: 420px; height: 420px; }
.realdo-login-orbit-two { right: -85px; bottom: 110px; width: 290px; height: 290px; border-color: rgba(255,255,255,.09); }

body.login-page .realdo-login-form-panel { display: flex; flex-direction: column; justify-content: center; padding: 56px clamp(30px, 5vw, 64px); background: var(--app-surface); }
.realdo-login-form-heading { margin-bottom: 32px; }
.realdo-login-form-heading h2 { margin: 9px 0 7px; color: var(--auth-ink); font-size: 25px; font-weight: 750; letter-spacing: -.035em; }
.realdo-login-form-heading p { margin: 0; color: var(--app-muted); font-size: 13px; }
.realdo-login-message { margin:0 0 20px; padding:11px 13px; border:1px solid var(--app-line); border-radius:10px; font-size:13px; line-height:1.45; }
.realdo-login-message.is-error { border-color:var(--app-danger); background:var(--app-danger-soft); color:var(--app-danger); }
.realdo-login-message.is-success { border-color:var(--app-success); background:var(--app-success-soft); color:var(--app-success); }
.realdo-login-message.is-neutral { background:var(--app-canvas); color:var(--app-ink); }
.realdo-login-channel-group,.realdo-login-code-group { min-width:0; margin:0 0 22px; padding:0; border:0; }
.realdo-login-channel-group legend,.realdo-login-code-group legend { width:auto; margin:0 0 10px; padding:0; border:0; color:var(--app-ink); font-size:13px; font-weight:700; }
.realdo-login-channel-options { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.realdo-login-channel { position:relative; display:block; margin:0; cursor:pointer; }
.realdo-login-channel input { position:absolute; width:100%; height:100%; margin:0; opacity:0; cursor:pointer; }
.realdo-login-channel span { display:flex; min-height:50px; align-items:center; justify-content:center; gap:9px; border:1px solid var(--app-line); border-radius:10px; background:var(--app-canvas); color:var(--app-ink); font-size:13px; font-weight:700; }
.realdo-login-channel input:checked + span { border-color:var(--app-brand); background:var(--app-selected); color:var(--app-brand); box-shadow:inset 0 0 0 1px var(--app-brand); }
.realdo-login-channel input:focus-visible + span { outline:2px solid var(--app-brand); outline-offset:3px; }
.realdo-login-channel .fa { font-size:17px; }
.realdo-login-form .realdo-login-field { margin:0 0 22px; }
.realdo-login-form .realdo-login-field label,.realdo-login-label-row label { margin:0 0 9px; color:var(--app-ink); font-size:13px; font-weight:700; }
.realdo-login-label-row { display:flex; align-items:baseline; justify-content:space-between; gap:12px; }
.realdo-login-label-row a { font-size:12px; font-weight:650; }
.realdo-login-password-wrap { position:relative; }
.realdo-login-password-wrap input { padding-right:70px !important; }
.realdo-login-show-password { position:absolute; top:50%; right:10px; transform:translateY(-50%); padding:5px 7px; border:0; background:transparent; color:var(--app-brand); font-size:12px; font-weight:700; }
.realdo-login-caps { margin:8px 0 0; color:var(--app-danger); font-size:12px; }
.realdo-login-sent { display:flex; align-items:center; gap:11px; margin:0 0 24px; padding:12px 14px; border-radius:10px; background:var(--app-canvas); color:var(--app-ink); font-size:12px; line-height:1.45; overflow-wrap:anywhere; }
.realdo-login-sent .fa { color:var(--app-brand); font-size:18px; }
.realdo-login-code-boxes { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:7px; }
body.login-page .realdo-login-code-digit { width:100%; min-width:0; height:54px; padding:0; border:1px solid var(--app-line); border-radius:10px; background:var(--app-canvas); color:var(--auth-ink); font-size:24px; font-weight:700; text-align:center; }
body.login-page .realdo-login-code-digit:focus { border-color:var(--app-brand); outline:2px solid var(--app-brand); outline-offset:1px; }
.realdo-login-code-boxes.has-error .realdo-login-code-digit { border-color:var(--app-danger); }
.realdo-login-code-boxes.has-error { animation:realdo-login-shake .3s ease-in-out; }
@keyframes realdo-login-shake { 25% { transform:translateX(-4px); } 50% { transform:translateX(4px); } 75% { transform:translateX(-2px); } }
.realdo-login-code-group p { margin:9px 0 0; color:var(--app-muted); font-size:12px; }
.realdo-login-resend-form { margin:17px 0 0; text-align:center; }
.realdo-login-resend { padding:5px; border:0; background:transparent; color:var(--app-brand); font-size:13px; font-weight:700; }
.realdo-login-resend:disabled { color:var(--app-muted); cursor:not-allowed; }
.realdo-login-secondary-actions { display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; margin-top:18px; }
.realdo-login-switch { display:block; margin:20px 0 0; color:var(--app-brand); font-size:13px; font-weight:700; text-align:center; }
.realdo-login-secondary-actions .realdo-login-switch { margin:0; }
body.login-page .realdo-login-form input.LoginForm-input { height: 50px; min-height: 50px; border-color: var(--app-line); border-radius: 10px; background: var(--app-canvas); font-size: 14px; }
body.login-page .realdo-login-form input.LoginForm-input:focus { border-color: var(--app-brand); background: var(--app-surface); box-shadow: 0 0 0 3px color-mix(in srgb, var(--app-brand) 14%, transparent); }
.realdo-login-form-meta { display: flex; justify-content: flex-end; margin: -4px 0 20px; font-size: 12px; font-weight: 650; }
.realdo-login-form-meta a { color: var(--app-brand); }
.realdo-login-form-meta a:hover { color: var(--app-brand-dark); text-decoration: underline; }
body.login-page .realdo-login-form .realdo-login-submit { align-items: center; justify-content: center; height: 50px; margin: 0; padding: 0 17px; border-radius: 10px; background: var(--app-brand); text-align: center; }
body.login-page .realdo-login-form .realdo-login-submit:disabled { opacity:.6; cursor:not-allowed; }
body.login-page .realdo-login-form .realdo-login-submit span { font-size: 20px; font-weight: 400; transition: transform .18s ease; }
body.login-page .realdo-login-form .realdo-login-submit:hover span { transform: translateX(3px); }
.realdo-login-help { margin: 24px 0 0; color: var(--app-muted); font-size: 11px; text-align: center; }
.realdo-reset-request-form .realdo-login-field,
.realdo-password-reset-form .realdo-login-field { margin-bottom: 22px; }
.realdo-reset-field-error { margin-top: 7px; color: var(--app-danger); font-size: 12px; line-height: 1.4; }
.realdo-reset-request-form .realdo-login-field.has-error input,
.realdo-password-reset-form .realdo-login-field.has-error input { border-color: var(--app-danger); }
.realdo-reset-request-form .realdo-login-field.has-error input:focus,
.realdo-password-reset-form .realdo-login-field.has-error input:focus { box-shadow: 0 0 0 3px color-mix(in srgb, var(--app-danger) 14%, transparent); }

@media (max-width: 767px) {
    body.login-page .realdo-login-shell { grid-template-columns: 1fr; width: min(100%, 480px); min-height: 0; border-radius: 18px; }
    body.login-page .realdo-login-brand { min-height: 200px; padding: 24px 26px; }
    .realdo-login-brand-copy { max-width: 300px; margin: 28px 0 6px; padding: 0; }
    .realdo-login-brand-copy h1 { margin: 8px 0 6px; font-size: 28px; }
    .realdo-login-brand-copy p { font-size: 12px; }
    .realdo-login-brand-note { display: none; }
    .realdo-login-orbit-one { right: -240px; bottom: -250px; }
    .realdo-login-orbit-two { right: -190px; bottom: -195px; }
    body.login-page .realdo-login-form-panel { padding: 32px 26px 30px; }
    .realdo-login-form-heading { margin-bottom: 24px; }
    .realdo-login-form-heading h2 { font-size: 22px; }
}

@media (max-width: 820px) {
    body.login-page .wrap { padding:calc(12px + env(safe-area-inset-top)) calc(10px + env(safe-area-inset-right)) calc(12px + env(safe-area-inset-bottom)) calc(10px + env(safe-area-inset-left)); }
    body.login-page .realdo-login-shell { grid-template-columns:1fr; width:min(100%,480px); min-height:0; }
    body.login-page .realdo-login-brand { min-height:72px; padding:13px 20px; }
    .realdo-login-brand-copy,.realdo-login-brand-note,.realdo-login-product,.realdo-login-orbit { display:none; }
    body.login-page .realdo-login-form-panel { padding:30px 20px 32px; }
}
@media (max-width: 390px) {
    body.login-page .realdo-login-form-panel { padding:25px 17px 28px; }
    .realdo-login-code-boxes { gap:5px; }
    body.login-page .realdo-login-code-digit { height:48px; font-size:21px; }
}
@media (prefers-reduced-motion: reduce) {
    .realdo-login-code-boxes.has-error { animation:none; }
}

html[data-theme="dark"] body.login-page .realdo-login-form-panel :is(.realdo-login-eyebrow,.realdo-login-label-row a,.realdo-login-show-password,.realdo-login-resend:not(:disabled),.realdo-login-switch) { color:#C6B8FF; }
html[data-theme="dark"] body.login-page .realdo-login-channel input:checked + span { color:#C6B8FF; border-color:#A98CFF; }
html[data-theme="dark"] body.login-page .realdo-login-sent .fa { color:#C6B8FF; }
html[data-theme="dark"] body.login-page :is(a,button,input):focus-visible,
html[data-theme="dark"] body.login-page .realdo-login-channel input:focus-visible + span { outline-color:#C6B8FF; }
