:root {color-scheme:light; --ink:#203b35; --muted:#6d7872; --green:#245749; --line:#dfe6dd;}
* {box-sizing:border-box;}
body {margin:0; min-width:280px; min-height:100vh; background:#f4f5ef; color:var(--ink); font-family:Arial, Helvetica, sans-serif; display:flex; flex-direction:column;}
button, input {font:inherit;}
a {color:inherit;}
[hidden] {display:none !important;}
.header {width:100%; border-bottom:1px solid var(--line);}
.header_inner {max-width:1120px; margin:0 auto; padding:24px 32px;}
.app_name {font-size:18px; font-weight:700; letter-spacing:-.4px; text-decoration:none;}
.main {width:100%; flex:1; display:flex; align-items:center; justify-content:center; padding:64px 24px;}
.login_card {width:100%; max-width:460px; padding:40px; background:#fff; border:1px solid var(--line); border-radius:20px; box-shadow:0 14px 45px rgba(32,59,53,.04);}
.card_mark {width:48px; height:48px; display:flex; align-items:center; justify-content:center; margin-bottom:32px; border-radius:14px; background:#e8f0e7; color:var(--green); font-size:27px;}
.eyebrow {margin:0 0 12px; color:var(--green); font-size:11px; font-weight:700; letter-spacing:1.7px; text-transform:uppercase;}
h1 {margin:0; font-size:36px; line-height:1.15; letter-spacing:-1.3px; overflow-wrap:anywhere;}
.intro {margin:16px 0 28px; color:var(--muted); font-size:15px; line-height:1.65;}
.google_button_wrap {min-height:44px; display:flex; justify-content:center; margin:8px 0 18px;}
.google_button_wrap.is_busy {pointer-events:none; opacity:.6;}
.small_text {margin:0; font-size:12px; line-height:1.6; text-align:center; color:var(--muted);}
.account_email {display:block; font-size:14px; line-height:1.5; overflow-wrap:anywhere;}
#profile_email {margin:-10px 0 26px;}
label {display:block; font-size:13px; font-weight:700; margin-bottom:9px;}
.input {width:100%; height:48px; padding:12px 14px; border:1px solid #cbd5cb; border-radius:8px; color:var(--ink); background:#fff;}
.input:focus {outline:3px solid #dceadd; outline-offset:1px; border-color:var(--green);}
.field_help {margin:9px 0 24px; color:var(--muted); font-size:12px; line-height:1.5;}
.btn {width:100%; min-height:48px; padding:13px 16px; display:flex; align-items:center; justify-content:space-between; gap:15px; border:1px solid var(--green); border-radius:8px; color:#fff; background:var(--green); cursor:pointer; font-size:14px; font-weight:700;}
.btn:hover {background:#183f34;}
.btn:focus-visible, .app_name:focus-visible {outline:3px solid #9dbfa5; outline-offset:4px;}
.btn:disabled {opacity:.65; cursor:wait;}
.btn_secondary {background:#fff; border-color:var(--line); color:var(--ink);}
.btn_secondary:hover {background:#f4f7f2;}
.form_message, .notice {margin:22px 0 0; padding:13px 14px; border-radius:8px; color:var(--ink); background:#edf3ed; font-size:13px; line-height:1.6;}
.form_message.is_error {color:#87352c; background:#fff0ed;}
.account_detail {padding:20px 0; margin:0 0 26px; border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
.detail_label {display:block; color:var(--muted); font-size:11px; margin-bottom:7px;}
.footer {padding:0 24px 24px; color:var(--muted); text-align:center; font-size:11px;}
@media screen and (max-width:480px) {
    .header_inner {padding:21px 24px;}
    .main {padding:36px 16px;}
    .login_card {padding:30px 24px; border-radius:16px;}
    h1 {font-size:31px;}
    .card_mark {margin-bottom:28px;}
}