* { box-sizing: border-box; }
:root { font-family: "Segoe UI", -apple-system, BlinkMacSystemFont, sans-serif; color: #222b29; letter-spacing: 0; color-scheme: light; }
body { margin: 0; }
button, input { font: inherit; letter-spacing: 0; }
[hidden] { display: none !important; }
.dm-login { min-height: 100vh; min-height: 100svh; display: grid; grid-template-rows: auto 1fr auto; position: relative; background: #28322f; isolation: isolate; }
.login-background { position: fixed; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center center; filter: saturate(.85) brightness(1.12); z-index: -3; }
.login-shade { position: fixed; inset: 0; background: rgba(15, 25, 23, .04); z-index: -2; }
.login-data-network { position: fixed; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: -1; }
@media (prefers-reduced-motion: reduce) { .login-data-network { display: none; } }
.login-header { min-height: 104px; padding: 28px 52px; display: flex; align-items: center; justify-content: space-between; gap: 24px; color: #fff; border-bottom: 1px solid rgba(255,255,255,.2); background: rgba(23,32,29,.18); }
.wordmark { font-size: 24px; font-weight: 650; display: flex; align-items: center; gap: 12px; line-height: 1.3; }
.pro-label { font-size: 11px; font-weight: 700; color: #d6ecb5; border: 1px solid #93af81; border-radius: 3px; padding: 4px 7px; }
.workspace-label { font-size: 13px; color: #eef1ec; }
.login-main { display: grid; place-items: center; padding: 24px; }
.access-panel { width: min(100%, 360px); position: relative; color: #19343d; color-scheme: light; background: #eef6f8; border: 1px solid #c1e6ec; border-radius: 8px; overflow: hidden; box-shadow: 0 30px 70px -12px rgba(0, 0, 0, .65), 0 8px 24px rgba(0, 0, 0, .38), 0 0 40px rgba(0, 0, 0, .22), inset 0 1px 0 #fff; animation: arrive .5s ease-out both; }
@supports (backdrop-filter: blur(20px)) {
    .access-panel { background: rgba(238, 246, 248, .96); backdrop-filter: blur(20px); }
}
.access-panel::before, .access-panel::after { content: ""; position: absolute; pointer-events: none; width: 22px; height: 22px; border-color: #81e3e7; border-style: solid; }
.access-panel::before { top: 9px; left: 9px; border-width: 1px 0 0 1px; }
.access-panel::after { bottom: 9px; right: 9px; border-width: 0 1px 1px 0; }
.panel-accent { height: 2px; background: #7ce0e4; width: 84px; margin: 0 auto; box-shadow: 0 0 14px #75e1e680; }
.access-content { padding: 16px 22px 10px; }
.access-eyebrow { display: flex; align-items: center; gap: 12px; font-size: 11px; font-weight: 600; color: #346c77; margin-bottom: 8px; }
.access-eyebrow::after { content: ""; height: 1px; flex: 1; background: #b6d3da; }
.access-heading { margin-bottom: 10px; }
h1 { margin: 0 0 6px; font-size: 22px; font-weight: 650; line-height: 1.25; }
.access-heading p { margin: 0; color: #506a75; font-size: 14px; line-height: 1.6; }
.field-group { margin-bottom: 10px; }
label { display: block; font-size: 13px; font-weight: 600; margin-bottom: 7px; color: #294650; }
input:not([type=hidden]) { display: block; width: 100%; min-height: 50px; border: 1px solid #9ebbc6; border-radius: 5px; padding: 12px 14px; background: #fff; color: #19343d; caret-color: #147d88; font-size: 16px; transition: border-color .15s, box-shadow .15s; box-shadow: inset 0 1px 2px #132c3605; }
input::placeholder { color: #607882; font-size: 14px; }
input:hover { border-color: #698e9b; }
input:focus { outline: none; border-color: #258492; box-shadow: 0 0 0 3px #25849220; background: #fff; }
input:-webkit-autofill { -webkit-text-fill-color: #19343d; caret-color: #147d88; box-shadow: 0 0 0 1000px #fff inset; }
.password-control { position: relative; }
.password-control input { padding-right: 54px; }
.password-toggle { position: absolute; right: 4px; top: 3px; width: 44px; height: 44px; display: grid; place-items: center; border: 0; border-radius: 4px; background: transparent; cursor: pointer; }
.password-toggle img { opacity: .75; filter: none; }
.password-toggle:hover { background: #a1e9ed14; }
button:focus-visible { outline: 3px solid #258492; outline-offset: 3px; }
.login-submit { margin-top: 4px; min-height: 48px; width: 100%; display: flex; align-items: center; justify-content: center; gap: 16px; border: 1px solid #b8f4f4; border-radius: 5px; background: #8adfe1; color: #10282c; font-size: 14px; font-weight: 700; cursor: pointer; box-shadow: 0 0 20px #64dae31a, inset 0 1px 0 #ffffff80; transition: background .15s, box-shadow .15s; }
.login-submit:hover { background: #b4f1ef; box-shadow: 0 0 26px #64dae333; }
.submit-arrow { filter: none; }
.login-submit:disabled { cursor: wait; opacity: .75; }
.submit-spinner { width: 18px; height: 18px; border: 2px solid #10282c40; border-top-color: #10282c; border-radius: 50%; animation: spin .8s linear infinite; }
.access-help { border-top: 1px solid #b6d3da; margin-top: 12px; padding-top: 10px; text-align: center; font-size: 12px; line-height: 1.5; color: #506a75; }
.access-help > span { font-weight: 600; color: #294650; }
.access-help p { margin: 2px 0 0; }
.panel-footer { background: #dfedf1; padding: 10px 20px; display: flex; justify-content: center; align-items: center; gap: 8px; font-size: 11px; color: #45626e; border-top: 1px solid #b6d3da; }
.panel-footer img { opacity: .7; filter: none; flex-shrink: 0; }
.login-footer { padding: 22px 52px; display: flex; justify-content: space-between; gap: 20px; font-size: 12px; color: #fff; background: rgba(14,23,20,.25); }
.footer-divider { margin: 0 10px; color: #b7d484; }
.login-errors.validation-summary-valid, .field-validation-valid { display: none; }
.login-errors.validation-summary-errors { margin-bottom: 18px; padding: 12px 14px; border-left: 3px solid #b54545; border-radius: 3px; background: #fcf0f0; color: #963131; font-size: 13px; line-height: 1.6; }
.login-errors ul { list-style: none; margin: 0; padding: 0; }
.field-error { display: block; font-size: 12px; color: #963131; margin-top: 7px; }
input.input-validation-error { border-color: #b54545; }
.caps-lock { display: block; margin-top: 8px; font-size: 12px; color: #795a1d; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
@keyframes arrive { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
@keyframes spin { to { transform: rotate(360deg); } }
@media (max-width: 600px) {
    .login-header { padding: 23px 24px; min-height: 84px; }
    .wordmark { font-size: 21px; gap: 9px; }
    .workspace-label { display: none; }
    .login-main { padding: 24px 20px; justify-items: center; }
    .access-content { padding: 16px 22px 10px; }
    .login-footer { padding: 20px 24px; font-size: 11px; }
    .login-background { object-position: center center; }
}
@media (max-width: 360px) {
    .login-main { padding-inline: 14px; }
    .access-content { padding-inline: 22px; }
    .wordmark { font-size: 19px; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; } }