body.task-login { background: #f8faf7; color: #183653; font-family: Nunito, "Segoe UI", sans-serif; }
body.task-login #layout-content { display: block; width: 100%; height: auto; min-height: 100dvh; overflow: auto; text-align: left; }
.lumitaika-mail-login { display: grid; grid-template-columns: minmax(0, 1fr) minmax(360px, 440px); align-items: center; gap: 48px; width: min(1380px, 100%); min-height: 100dvh; margin: auto; padding: 48px clamp(28px, 5vw, 72px); background: url('../images/scene.png') left center / auto 100% no-repeat; }
.lumitaika-mail-story { align-self: end; padding: 0 0 48px clamp(180px, 22vw, 300px); }
.lumitaika-mail-story p { max-width: 240px; margin: 0; color: #395e4c; font-size: 19px; font-weight: 800; line-height: 1.35; }
.lumitaika-mail-panel { padding: 36px; border: 1px solid #e1e7e4; border-radius: 16px; background: #fffefa; box-shadow: 0 18px 50px rgb(55 65 79 / 14%); }
.lumitaika-mail-brand { display: inline-flex; flex-direction: column; margin-bottom: 38px; text-decoration: none; }
.lumitaika-mail-wordmark { font-size: 32px; font-weight: 900; letter-spacing: -.055em; line-height: 1.1; }
.lumitaika-mail-wordmark span:nth-child(1) { color: #386653; }
.lumitaika-mail-wordmark span:nth-child(2) { color: #d8a653; }
.lumitaika-mail-wordmark span:nth-child(3) { color: #53678b; }
.lumitaika-mail-wordmark span:nth-child(4) { color: #bf654e; }
.lumitaika-mail-brand small { color: #53678b; font-size: 11px; font-weight: 700; letter-spacing: .04em; }
.lumitaika-mail-panel h2 { margin: 0 0 6px; color: #183653; font-size: 27px; font-weight: 900; line-height: 1.25; }
.lumitaika-mail-panel > p { margin: 0 0 24px; color: #52677f; font-size: 15px; }
body.task-login #login-form { position: static; width: 100%; max-width: none; margin: 0; text-align: left; }
body.task-login #login-form table, body.task-login #login-form tbody, body.task-login #login-form tr, body.task-login #login-form td { display: block; width: 100%; }
body.task-login #login-form tr + tr { margin-top: 14px; }
body.task-login #login-form td.title { padding: 0 0 6px; color: #344b62; font-size: 13px; font-weight: 800; }
body.task-login #login-form td.input { padding: 0; }
body.task-login #login-form input { width: 100%; min-height: 44px; border: 1px solid #cbd7d0; border-radius: 9px; background: #fff; color: #183653; font-size: 16px; }
body.task-login #login-form .formbuttons { margin: 20px 0 0; }
body.task-login #login-form input:focus-visible, .lumitaika-mail-panel a:focus-visible { outline: 3px solid #d8a653; outline-offset: 2px; }
body.task-login #login-form button { width: 100%; min-height: 44px; border-radius: 9px; background: #3f6c58; color: #fff; font-weight: 800; }
body.task-login #login-form button:hover { background: #354f42; }
.lumitaika-mail-return { display: inline-block; margin-top: 25px; color: #315340; font-size: 14px; font-weight: 800; text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 800px) {
  .lumitaika-mail-login { grid-template-columns: minmax(0, 1fr); justify-items: center; padding: 24px; background-image: none; }
  .lumitaika-mail-story { display: none; }
  .lumitaika-mail-panel { width: min(440px, 100%); padding: 30px 24px; }
}