.login-page { --login-ink:#10233e; --login-ink-soft:#28405f; --login-paper:#f6f8fb; --login-line:#d8e2ec; --login-mint:#09a887; --login-mint-dark:#078a70; --login-muted:#65758b; background:var(--login-paper); color:var(--login-ink); font-family:"DM Sans",sans-serif; margin:0; min-height:100svh; }
.login-page *, .login-page *::before, .login-page *::after { box-sizing:border-box; }
.login-shell { display:grid; grid-template-columns:minmax(320px,.92fr) minmax(420px,1.08fr); min-height:100svh; }
.login-brand { background:var(--login-ink); color:#fff; display:flex; flex-direction:column; justify-content:space-between; overflow:hidden; padding:clamp(2rem,6vw,5rem); position:relative; }
.login-brand::after { border:1px solid rgba(255,255,255,.1); border-radius:50%; content:""; height:min(56vw,720px); position:absolute; right:-26%; top:14%; width:min(56vw,720px); }
.login-brand__logo,.login-tenant__logo { display:block; object-fit:contain; object-position:left center; }
.login-brand__logo { height:48px; max-width:175px; position:relative; z-index:1; }
.login-brand__content { max-width:480px; padding-bottom:2rem; position:relative; z-index:1; }
.login-brand__eyebrow { color:#8fe0cf; font-size:.83rem; font-weight:700; letter-spacing:.06em; margin:0 0 1.1rem; text-transform:uppercase; }
.login-brand h1,.login-access h2 { font-family:"Manrope",sans-serif; letter-spacing:-.055em; }
.login-brand h1 { font-size:clamp(2.35rem,4.2vw,4.6rem); line-height:.98; margin:0; }
.login-brand__content > p:not(.login-brand__eyebrow) { color:#bdcadd; font-size:1.06rem; line-height:1.65; margin:1.55rem 0 0; max-width:32rem; }
.login-brand__footer { color:#9eb0c9; font-size:.8rem; position:relative; z-index:1; }
.login-access { align-items:center; display:flex; justify-content:center; padding:2rem; }
.login-access__content { animation:login-arrive .5s ease-out both; max-width:430px; width:100%; }
.login-back { color:var(--login-ink-soft); display:inline-flex; font-size:.9rem; font-weight:700; margin-bottom:clamp(2rem,8vh,5rem); text-decoration:none; }
.login-back:hover,.login-back:focus-visible { color:var(--login-mint-dark); }
.login-tenant { align-items:center; background:var(--login-ink); border-radius:1rem; box-shadow:0 10px 24px rgba(16,35,62,.08); display:flex; gap:1rem; margin:0 0 1.75rem; min-height:74px; padding:1rem 1.2rem; }
.login-tenant__logo { flex:0 0 auto; height:42px; max-width:160px; }
.login-tenant__meta { display:flex; flex-direction:column; min-width:0; }
.login-tenant__label { color:rgba(255,255,255,.68); font-size:.72rem; font-weight:700; letter-spacing:.075em; margin-bottom:.22rem; text-transform:uppercase; }
.login-tenant__name { color:#fff; font-size:1.02rem; font-weight:700; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.login-access h2 { font-size:clamp(2rem,3vw,2.65rem); line-height:1.08; margin:0; }
.login-intro { color:var(--login-muted); line-height:1.55; margin:.7rem 0 2.4rem; }
.login-message { border-radius:.6rem; margin:0 0 1.25rem; padding:.85rem 1rem; }
.login-message--info { background:#e8f4f1; color:#176958; }
.login-message--error { background:#fceded; color:#a63030; }
.login-field { display:grid; gap:.55rem; margin-top:1.25rem; }
.login-field label,.login-remember label { color:var(--login-ink-soft); font-size:.9rem; font-weight:700; }
.login-field input[type="email"],.login-field input[type="password"] { background:#fff; border:1px solid var(--login-line); border-radius:.6rem; color:var(--login-ink); font:inherit; min-height:3.35rem; outline:none; padding:.75rem 1rem; transition:border-color .16s,box-shadow .16s; width:100%; }
.login-field input:focus { border-color:var(--login-mint); box-shadow:0 0 0 4px rgba(9,168,135,.13); }
.login-validator { color:#b93838; font-size:.8rem; }
.login-remember { align-items:flex-start; display:flex; gap:.7rem; margin:1.6rem 0 1.85rem; }
.login-remember input[type="checkbox"] { accent-color:var(--login-mint); flex:0 0 auto; height:1rem; margin:.15rem 0 0; width:1rem; }
.login-remember small { color:var(--login-muted); display:block; font-size:.78rem; font-weight:400; line-height:1.4; margin-top:.18rem; }
.login-submit { background:var(--login-mint); border:0; border-radius:.6rem; box-shadow:0 8px 18px rgba(9,168,135,.2); color:#fff; cursor:pointer; font:700 1rem "DM Sans",sans-serif; min-height:3.35rem; transition:background .16s,box-shadow .16s,transform .16s; width:100%; }
.login-submit:hover,.login-submit:focus-visible { background:var(--login-mint-dark); box-shadow:0 11px 22px rgba(9,168,135,.26); transform:translateY(-1px); }
.login-submit:focus-visible,.login-back:focus-visible { outline:3px solid rgba(9,168,135,.45); outline-offset:3px; }
.login-help { color:var(--login-muted); font-size:.82rem; line-height:1.5; margin:1.5rem 0 0; text-align:center; }
@keyframes login-arrive { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:translateY(0); } }
@media (prefers-reduced-motion:reduce) { .login-access__content { animation:none; } .login-page * { transition:none !important; } }
@media (max-width:760px) { .login-shell { grid-template-columns:1fr; } .login-brand { min-height:30svh; padding:2rem; } .login-brand__content { padding:3.75rem 0 0; } .login-brand h1 { font-size:2.4rem; } .login-brand__content > p:not(.login-brand__eyebrow),.login-brand__footer { display:none; } .login-access { align-items:flex-start; padding:3rem 1.5rem; } .login-back { margin-bottom:2.6rem; } }