@layer views {
.login-screen .login-panel[hidden], #loginMethodTabs[hidden], #loginScreen[hidden] { display:none; }
#loginScreen.login-screen { overflow-y:auto; display:flex; flex-direction:column; justify-content:safe center; gap:20px; padding:40px 24px; background:radial-gradient(ellipse at 12% 18%,#e6eee7 0,transparent 55%),#f5f5ef; color:#233c31; }
.login-screen .login-frame { display:grid; grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr); width:min(100%,1040px); flex-shrink:0; min-width:0; overflow:hidden; border:1px solid #dce5dd; border-radius:24px; background:white; box-shadow:0 24px 80px -32px #244a3430; }
.login-story { position:relative; overflow:hidden; display:flex; flex-direction:column; padding:42px 40px 30px; background:linear-gradient(145deg,#214c3d,#326b51); color:white; }
.login-story::after { content:""; position:absolute; width:440px; height:300px; right:-190px; bottom:-140px; transform:rotate(-28deg); background:repeating-linear-gradient(90deg,transparent 0 12px,#ffffff0b 12px 13px); pointer-events:none; }
.login-wordmark { display:flex; align-items:center; gap:14px; }.login-wordmark img { border-radius:10px; flex-shrink:0; }.login-wordmark strong { display:block; font-size:22px; letter-spacing:4px; }.login-wordmark span { display:block; margin-top:5px; font-size:10px; letter-spacing:1px; color:#c6d9cb; }
.login-story-body { padding:65px 0; margin:auto 0; }.login-story-body small { font-size:12px; letter-spacing:3px; color:#c6d9cb; }.login-story-body h2 { margin:20px 0 18px; font-size:34px; font-weight:500; line-height:1.65; }.login-story-body p { margin:0; font-size:13px; line-height:2; color:#c6d9cb; }.login-workflow { display:flex; align-items:center; gap:12px; margin-top:30px; font-size:12px; }.login-workflow i { width:24px; height:1px; background:#93b49e; }.login-story-caption { font-size:10px; letter-spacing:1px; color:#b7cebe; }
.login-content { min-width:0; padding:48px 54px 26px; }.login-heading small { color:#718574; font-size:10px; letter-spacing:2px; }.login-heading h1 { margin:12px 0 10px; font-size:28px; font-weight:600; color:#233c31; }.login-heading p { margin:0 0 27px; color:#64776b; font-size:13px; line-height:1.8; }
.login-screen .login-panel { width:100%; padding:0; background:none; border:0; border-radius:0; box-shadow:none; gap:17px; }.login-screen .login-panel label { font-size:13px; color:#455d4d; gap:8px; }.login-screen .login-panel input { width:100%; min-width:0; min-height:46px; border:1px solid #d5e0d7; border-radius:9px; background:white; padding:12px 14px; font-size:15px; color:#233c31; }.login-screen .login-panel input:focus { border-color:#4c9466; box-shadow:0 0 0 3px #4c946614; }.login-screen .login-panel input::placeholder { color:#899b8e; font-size:13px; }
.login-screen .login-panel .primary-button { min-height:46px; border-radius:9px; background:#2f7d5c; border:1px solid transparent; font-size:14px; box-shadow:none; }.login-screen .login-panel .primary-button:hover { background:#246447; }.login-screen .login-password-field { position:relative; display:block; }.login-screen .login-password-field input { padding-right:65px; }.login-password-field button { position:absolute; inset:2px 4px 2px auto; padding:0 10px; background:none; border:0; color:#52705d; font-size:12px; cursor:pointer; }
.login-feishu { display:flex; align-items:center; justify-content:center; gap:10px; min-height:46px; border:1px solid #ccdfd1; background:#f0f7f1; border-radius:9px; color:#2b684b; text-decoration:none; font-size:14px; font-weight:600; }.login-feishu:hover { background:#e5f1e8; }.login-feishu svg { width:22px; height:22px; }#loginFeishuSection > p { text-align:center; font-size:11px; color:#718673; }.login-divider { display:flex; align-items:center; gap:14px; margin:22px 0; color:#819486; font-size:11px; }.login-divider::before,.login-divider::after { content:""; flex:1; height:1px; background:#e3ebe4; }
.login-screen .login-links { justify-content:space-between; gap:12px; margin-top:21px; flex-wrap:wrap; }.login-screen .login-links a, #loginPasswordFallback { color:#2f7d5c; font-size:12px; }.login-screen .login-footnote { margin-top:30px; color:#829086; text-align:center; font-size:11px; }.login-screen .login-error { margin:0; font-size:12px; color:#a53336; line-height:1.7; min-height:0; }.login-screen .login-error:empty { display:none; }.login-screen .login-error:not(:empty) { padding:10px 12px; border:1px solid #efd4d5; border-radius:9px; background:#fcf3f3; }.login-screen .login-footer { color:#747f74; font-size:10px; flex-shrink:0; }.login-screen :is(a,button,input):focus-visible { outline:3px solid #69a67b85; outline-offset:3px; }
.login-method-tabs { display:flex; gap:22px; margin:0 0 22px; border-bottom:1px solid #dce5dd; }
.login-method-tabs button { flex:1; padding:11px 0; border:0; border-radius:0; border-bottom:2px solid transparent; background:none; color:#64776b; font-size:14px; cursor:pointer; }
.login-method-tabs button[aria-selected="true"] { color:#246447; border-bottom-color:#2f7d5c; font-weight:600; }
.login-sms-code-row { display:flex; align-items:stretch; gap:10px; min-width:0; }
.login-screen .login-panel .login-sms-code-row input { flex:1; width:0; }
.login-sms-code-row button { flex-shrink:0; min-width:108px; padding:10px; border:1px solid #ccdfd1; border-radius:9px; color:#2b684b; background:#f0f7f1; font-size:12px; cursor:pointer; }
.login-sms-code-row button:disabled { color:#687b6d; background:#f5f7f5; cursor:default; }
.login-sms-status { margin:0; font-size:12px; line-height:1.7; color:#2b684b; }.login-sms-status:empty { display:none; }
@media(max-width:760px) { #loginScreen.login-screen { padding:24px 16px; justify-content:flex-start; }.login-screen .login-frame { grid-template-columns:1fr; max-width:480px; border-radius:18px; }.login-story { padding:24px 28px; }.login-story-body,.login-story-caption { display:none; }.login-content { padding:30px 28px 22px; }.login-wordmark strong { font-size:20px; }.login-heading h1 { font-size:26px; } }
@media(max-width:360px) { .login-content { padding-inline:20px; }#loginScreen.login-screen { padding:14px 10px; } }
@media(min-width:761px) and (max-height:760px) { #loginScreen.login-screen { justify-content:flex-start; padding-block:20px; }.login-content { padding-block:28px; }.login-story-body { padding-block:35px; } }
}