.mail-help-page {
    padding: 1.25rem;
    max-width: 1200px;
}

#taskmenu a.button-mailhelp {
    order: 25;
}

#taskmenu a.button-mailhelp:before {
    content: "\f02d";
}

#taskmenu a.button-mail,
#taskmenu a.button-compose { order: 10; }
#taskmenu a.button-addressbook { order: 20; }
#taskmenu a.button-settings { order: 30; }

.mail-help-scroller {
    overflow: auto;
}

.mail-help-hero {
    margin-bottom: 1.25rem;
}

.mail-help-hero h2 {
    margin: 0 0 .35rem;
}

.mail-help-hero p,
.mail-help-description,
.mail-help-small-note {
    color: var(--color-font-secondary, #737677);
}

.mail-help-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 1rem;
}

.mail-help-card {
    display: flex;
    flex-direction: column;
    min-height: 280px;
    padding: 1.15rem;
    border: 1px solid var(--border-color, #d4d4d4);
    border-radius: .5rem;
    background: rgba(127, 127, 127, .035);
}

.mail-help-card-heading {
    display: flex;
    align-items: center;
    gap: .65rem;
}

.mail-help-card-heading h3 {
    flex: 1;
    margin: 0;
}

.mail-help-symbol {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.6rem;
    height: 2.6rem;
    border-radius: 50%;
    background: #0878b9;
    color: #fff;
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .03em;
}

.mail-help-badge {
    padding: .15rem .45rem;
    border-radius: 1rem;
    font-size: .72rem;
    white-space: nowrap;
}

.mail-help-badge.recommended { background: #dff3e4; color: #237638; }
.mail-help-badge.caution { background: #fff0cc; color: #855d00; }
.mail-help-badge.restricted { background: #e6e8ea; color: #555; }

.mail-help-description {
    margin: .8rem 0 .45rem;
}

.mail-help-steps {
    flex: 1;
    margin: .25rem 0 1rem;
    padding-left: 1.35rem;
}

.mail-help-steps li {
    margin-bottom: .35rem;
}

.mail-help-link {
    align-self: flex-start;
}

.mail-help-training {
    margin-top: .55rem;
    padding: .65rem .75rem;
    border-left: 4px solid;
    border-radius: .25rem;
}

.mail-help-training strong,
.mail-help-training span {
    display: block;
}

.mail-help-training.spam,
.mail-help-training.ham {
    background: rgba(127, 127, 127, .09);
}
.mail-help-training.spam { border-color: #b65a5a; }
.mail-help-training.ham { border-color: #5c9969; }
.mail-help-small-note { font-size: .9rem; }

.mail-help-footer-note {
    margin: 0 0 1rem;
    padding: .8rem 1rem;
    border-left: 4px solid #0878b9;
    background: rgba(8, 120, 185, .08);
}

@media (max-width: 480px) {
    .mail-help-page { padding: .75rem; }
    .mail-help-grid { grid-template-columns: 1fr; }
    .mail-help-card { min-height: 0; }
}