:root { color-scheme:light; --brand:#BA3521; --ink:#454545; }
* { box-sizing:border-box; }
body { margin:0; color:var(--ink); background:#eee; font:15px/1.5 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
.login-layout { min-height:100vh; min-height:100dvh; }
.login-visual { position:relative; min-height:305px; height:37vh; max-height:420px; overflow:hidden; background:#454545; color:#fff; padding:calc(22px + env(safe-area-inset-top)) 24px 56px; }
.deck-photo { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 60%; }
.login-visual::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,#17171730 0%,#17171708 35%,#171717b3 100%); }
.login-brand { position:relative; z-index:1; display:inline-flex; align-items:center; gap:10px; font-size:20px; letter-spacing:-.6px; font-weight:650; }
.login-brand img { border-radius:12px; box-shadow:0 3px 12px #0002; }
.login-brand b { font-weight:400; }
.login-tagline { position:absolute; z-index:1; left:24px; bottom:58px; right:24px; }
.login-tagline>span { font-size:9px; font-weight:650; letter-spacing:1.7px; }
.login-tagline h2 { margin:9px 0 0; font-size:27px; line-height:1.16; letter-spacing:-.9px; font-weight:620; }
.login-content { position:relative; margin:-30px 14px 0; padding-bottom:max(20px,env(safe-area-inset-bottom)); }
.login-card { position:relative; z-index:2; border:1px solid #eee; border-radius:26px; padding:30px 24px 24px; background:#fff; box-shadow:0 10px 32px #4545450b; }
.login-eyebrow { font-size:10px; letter-spacing:1.8px; color:var(--brand); font-weight:750; }
h1 { margin:11px 0 10px; font-size:31px; font-weight:650; line-height:1.15; letter-spacing:-1.1px; }
.login-intro { margin:0 0 27px; color:#666; font-size:14px; line-height:1.65; }
form label { display:block; font-size:13px; font-weight:650; margin:0 0 9px; }
input { font:inherit; font-size:16px; color:var(--ink); width:100%; min-height:54px; padding:14px 15px; border:1px solid #bbb; border-radius:12px; background:#fff; }
input:focus { border-color:var(--brand); outline:3px solid #ba35211a; outline-offset:1px; }
input::placeholder { color:#8a8a8a; }
button { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:20px; width:100%; min-height:54px; padding:14px 18px; border:0; border-radius:12px; font:inherit; font-weight:650; background:var(--brand); color:#fff; cursor:pointer; }
button:hover { background:#a62e1d; }
button:disabled { opacity:.75; cursor:progress; }
button svg { width:21px; height:21px; fill:none; stroke:currentColor; stroke-width:1.8; }
a:focus-visible,button:focus-visible { outline:3px solid #7654a1; outline-offset:4px; }
.login-security { display:flex; align-items:center; justify-content:center; gap:7px; margin:26px 0 0; padding-top:20px; border-top:1px solid #eee; color:#777; font-size:10px; }
.login-security svg { width:15px; height:15px; flex-shrink:0; fill:none; stroke:currentColor; stroke-width:1.6; }
footer { margin:24px 0 0; text-align:center; color:#777; font-size:10px; }
.login-error { color:var(--brand); font-size:13px; margin:10px 0; }
.login-error ul { padding-left:18px; margin:0; }
.login-notice { background:#eee; border-radius:10px; padding:12px; margin:0 0 18px; font-size:13px; }
.login-back { display:block; color:var(--brand); margin:20px 0 0; padding:8px 0; min-height:44px; font-size:12px; }
.field-hint { font-size:12px; color:#777; margin:10px 0; }
#login-code { font-size:25px; letter-spacing:7px; text-align:center; }
@media(min-width:600px) and (max-width:899px) { .login-visual { min-height:390px; height:43vh; padding-left:40px; }.login-tagline{left:40px;bottom:78px}.login-tagline h2{font-size:39px}.login-content{max-width:520px;margin:-48px auto 0}.login-card{padding:38px} }
@media(min-width:900px) { .login-layout{display:grid;grid-template-columns:1.1fr 1fr;min-height:100dvh}.login-visual{height:100%;min-height:100dvh;max-height:none;padding:40px}.deck-photo{object-position:center}.login-tagline{left:48px;right:36px;bottom:64px}.login-tagline h2{font-size:clamp(34px,3.4vw,54px);max-width:620px}.login-tagline>span{font-size:10px}.login-content{margin:0;padding:40px;display:flex;flex-direction:column;justify-content:center;align-items:center;background:#fff}.login-card{border:0;box-shadow:none;width:100%;max-width:460px;padding:30px 20px}h1{font-size:36px}.login-intro{font-size:15px}.login-security{font-size:11px}footer{margin-top:30px} }
@media(max-height:650px) and (max-width:899px) { .login-visual{min-height:245px;height:245px}.login-tagline h2{font-size:23px}.login-card{padding-top:24px}.login-intro{margin-bottom:18px} }