:root {
    --tm-ink: #090c10;
    --tm-panel: #11161c;
    --tm-amber: #ff9b32;
}
body.task-login,
body.task-login #layout,
body.task-login #layout-content {
    background: var(--tm-ink);
    color: #edf0f4;
}
body.task-login #layout-content {
    overflow-y: auto;
    padding: 52px 24px 32px;
    background-image: radial-gradient(ellipse at 50% 0%, #3a251621, transparent 65%);
}
body.task-login #logo {
    top: 0;
    width: 76px;
    height: 76px;
    max-height: none;
    margin: 0 auto 20px;
}
body.task-login #login-form {
    top: 0;
    width: min(100%, 440px);
    max-width: 440px;
    margin: 0 auto;
    padding: 32px;
    border: 1px solid #6b4525;
    border-radius: 22px;
    background: var(--tm-panel);
    box-shadow: 0 24px 80px #0006;
}
.tm-mail-intro { text-align: center; margin-bottom: 32px; }
.tm-mail-wordmark { font-size: 20px; font-weight: 700; letter-spacing: 2px; }
.tm-mail-wordmark span { color: var(--tm-amber); }
.tm-mail-intro h2 { font-size: 25px; font-weight: 600; line-height: 1.5; margin: 24px 0 8px; }
.tm-mail-intro > p:last-child { color: #a8b0bb; font-size: 14px; }
body.task-login .form-control {
    background: #090d12;
    color: #f4f6f9;
    border-color: #47515f;
    border-radius: 10px;
    min-height: 48px;
}
body.task-login .input-group-text {
    background: #1b232e;
    color: var(--tm-amber);
    border-color: #47515f;
}
body.task-login .form-control:focus {
    border-color: var(--tm-amber);
    box-shadow: 0 0 0 3px #ff9b3226;
}
body.task-login button.btn-primary {
    background: var(--tm-amber);
    color: #17100a;
    border: 1px solid var(--tm-amber);
    border-radius: 10px;
    min-height: 48px;
    font-weight: 700;
}
body.task-login button.btn-primary:hover { background: #ffb15c; }
.tm-mail-note { color: #b6bec9; text-align: center; font-size: 13px; line-height: 1.9; margin-top: 24px; }
.tm-mail-note span { display: block; color: var(--tm-amber); margin-top: 6px; }
body.task-login #login-footer { margin-top: 20px; color: #a8b0bb; }
body:not(.task-login) #taskmenu { background: #0c1015; }
body:not(.task-login) #taskmenu a.selected { background: #332312; color: var(--tm-amber); }
body:not(.task-login) #taskmenu .action-buttons a { background: #a84f00; }
body:not(.task-login) #taskmenu #logo { width: 44px; height: 44px; margin: 14px auto; }
body:not(.task-login) .btn-primary {
    background-color: #a84f00;
    border-color: #a84f00;
}
body:not(.task-login) .btn-primary:hover { background-color: #863f00; }
body:not(.task-login) #taskmenu a:focus-visible {
    outline: 2px solid var(--tm-amber);
    outline-offset: -3px;
}
@media (max-width: 480px) {
    body.task-login #layout-content { padding: 24px 16px; }
    body.task-login #login-form { padding: 24px 20px; border-radius: 18px; }
    .tm-mail-intro h2 { font-size: 23px; }
}