html { color-scheme:light; }
body { background:#f8faf9; color:#142019; font-family:Inter,system-ui,sans-serif; }
.login-page { grid-template-columns:1fr 1fr; }
.login-showcase { padding:clamp(30px,5vw,76px); background-color:#12261a; }
.login-showcase::after { background:linear-gradient(145deg,rgba(10,34,20,.8),rgba(8,20,12,.8)); }
.login-showcase-content { max-width:540px; }
.login-showcase,.login-showcase h1,.login-feature strong { color:#f2f7f4; }
.login-showcase h1 { font-family:Outfit,sans-serif; font-weight:550; font-size:clamp(2.3rem,4vw,4.2rem); line-height:1.08; letter-spacing:-.035em; text-transform:none; }
.login-showcase h1 span,.login-badge i,.login-feature i { color:#b8efcb; }
.login-showcase p { font-size:1rem; line-height:1.8; color:#d4e3d9; }
.login-badge { font-size:.68rem; font-weight:650; letter-spacing:.09em; }
.login-feature-grid { gap:10px; margin-top:28px; }
.login-feature { border-radius:14px; padding:16px 12px; }
.login-feature strong { font-size:.76rem; line-height:1.5; }
.login-feature i { font-size:1.1rem; }
.login-panel-wrap { padding:40px; background:#f8faf9; }
.login-panel { width:100%; max-width:460px; padding:34px; border-radius:22px; background:#fff; border:1px solid #d8e2db; box-shadow:0 12px 48px rgba(20,55,30,.06); }
.login-logo { margin-bottom:30px; }
.login-logo-mark { background:#eaf5ee; color:#196237; box-shadow:none; border-radius:13px; }
.login-logo-text strong { color:#142019; }
.login-logo-text span,.login-panel>p { color:#4c5c53; }
.login-panel h2 { font:600 2rem/1.15 Outfit,sans-serif; color:#142019; letter-spacing:-.03em; text-transform:none; }
.login-panel>p { font-size:.91rem; line-height:1.7; }
.login-form { margin-top:26px; }
.login-group label { color:#142019; font-size:.84rem; font-weight:650; }
.login-input-wrap { background:#f8faf9; border:1px solid #c9d8ce; border-radius:11px; min-height:50px; }
.login-input-wrap>i { color:#4c5c53; }
.login-input-wrap input { color:#142019; background:transparent; border:0; box-shadow:none; font-size:1rem; min-width:0; width:100%; min-height:50px; padding-right:48px; }
.login-input-wrap input::placeholder { color:#6b7970; }
.login-input-wrap:focus-within { border-color:#196237; box-shadow:0 0 0 3px #e1f0e6; }
.login-submit { min-height:48px; background:#196237; color:#fff; border-radius:11px; font-size:.88rem; box-shadow:none; }
.login-submit:hover { background:#104a29; transform:none; }
.login-links,.login-links a { color:#4c5c53; font-size:.8rem; }
.login-links a:hover { color:#196237; }
.login-alert { color:#912b2b; background:#fff0f0; border:1px solid #efc7c7; border-radius:11px; font-size:.88rem; }
.login-password-toggle { position:absolute; right:4px; top:50%; transform:translateY(-50%); border:0; background:none; color:#4c5c53; min-width:44px; min-height:44px; cursor:pointer; }
:is(a,button,input):focus-visible { outline:3px solid #196237; outline-offset:3px; }
@media(max-width:980px) {
    .login-page { grid-template-columns:1fr; }
    .login-showcase { min-height:0; padding:36px 24px; }
    .login-showcase-content { max-width:660px; margin:auto; }
    .login-showcase h1 { font-size:2.2rem; }
    .login-feature-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
    .login-panel-wrap { padding:28px 18px; }
}
@media(max-width:480px) {
    .login-showcase { padding:28px 20px; }
    .login-showcase h1 { font-size:1.8rem; margin-bottom:16px; }
    .login-showcase p { font-size:.86rem; line-height:1.65; }
    .login-badge { margin-bottom:18px; }
    .login-feature-grid { gap:7px; margin-top:20px; }
    .login-feature { padding:12px 8px; }
    .login-feature strong { font-size:.65rem; }
    .login-panel { padding:26px 20px; border-radius:18px; }
    .login-panel h2 { font-size:1.65rem; }
    .login-links { gap:14px; }
}