body.mado-portal-account-page .mado-portal-shell--action-support-staff .mado-portal-shell__content-frame.is-standard,
.mado-portal-shell--action-support-staff .mado-portal-shell__content-frame.is-standard {
    box-sizing: border-box;
    width: 100%;
    max-width: calc(
        1140px
        + var(--mado-portal-page-gutter-x, clamp(18px, 2.4vw, 32px))
        + var(--mado-portal-page-gutter-x, clamp(18px, 2.4vw, 32px))
    );
    margin-left: auto;
    margin-right: auto;
    padding-left: var(--mado-portal-page-gutter-x, clamp(18px, 2.4vw, 32px));
    padding-right: var(--mado-portal-page-gutter-x, clamp(18px, 2.4vw, 32px));
}

@media (max-width: 782px) {
    body.mado-portal-account-page .mado-portal-shell--action-support-staff .mado-portal-shell__content-frame.is-standard,
    .mado-portal-shell--action-support-staff .mado-portal-shell__content-frame.is-standard {
        padding-left: var(--mado-portal-page-gutter-x-mobile, 16px);
        padding-right: var(--mado-portal-page-gutter-x-mobile, 16px);
    }
}

#mado-support-staff-manager.mado-support-staff-manager-root {
    --mado-support-accent: #14b3e3;
    --mado-support-accent-hover: #0f9cc8;
    --mado-support-accent-soft: #eefbfd;
    --mado-support-card-border: #d9e7ee;
    --mado-support-card-border-strong: #c7d8e3;
    --mado-support-table-border: #e5edf3;
    --mado-support-text: #0f172a;
    --mado-support-muted: #5b6b7e;
    display: grid;
    gap: 20px;
}
#mado-support-staff-manager .mado-support-staff-layout {
    display: grid;
    gap: 24px;
}
#mado-support-staff-manager .mado-support-section {
    display: grid;
    gap: 22px;
    padding: 22px;
    border: 1px solid var(--mado-support-card-border);
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.05);
}
#mado-support-staff-manager .mado-support-section--staff {
    margin-top: 24px;
}
#mado-support-staff-manager .mado-support-section__header {
    display: grid;
    gap: 6px;
}
#mado-support-staff-manager .mado-support-section__title {
    margin: 0;
    font-size: 22px;
    line-height: 1.4;
    font-weight: 800;
    color: var(--mado-support-text);
}
#mado-support-staff-manager .mado-support-account-tools {
    display: grid;
    grid-template-columns: 1fr;
    gap: 24px;
}
#mado-support-staff-manager .mado-support-split-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
}
#mado-support-staff-manager .mado-support-account-tool-card,
#mado-support-staff-manager .mado-support-form-card {
    display: grid;
    gap: 14px;
    padding: 18px;
    border: 1px solid var(--mado-support-card-border);
    border-radius: 14px;
    background: linear-gradient(180deg, #ffffff 0%, #fbfdff 100%);
}
#mado-support-staff-manager .mado-support-account-tool-card--settings {
    border-color: #bfe9f5;
    background: linear-gradient(180deg, #ffffff 0%, #f7fcff 100%);
}
#mado-support-staff-manager .mado-support-account-tool-card--accordion {
    padding: 0;
    gap: 0;
    overflow: hidden;
    background: #ffffff;
}
#mado-support-staff-manager .mado-support-account-tool-card--permissions {
    border-color: #c9deea;
    background: #ffffff;
    padding: 0;
    gap: 0;
    overflow: hidden;
}
#mado-support-staff-manager .mado-support-account-tool-card__title,
#mado-support-staff-manager .mado-support-form-card__title {
    margin: 0;
    font-size: 18px;
    line-height: 1.5;
    font-weight: 800;
    color: var(--mado-support-text);
}
#mado-support-staff-manager .mado-support-account-tool-card__description,
#mado-support-staff-manager .mado-support-account-tool-card__note {
    margin: 0;
    font-size: 13px;
    line-height: 1.8;
    color: var(--mado-support-muted);
}
#mado-support-staff-manager .mado-support-card-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    flex-wrap: wrap;
}
#mado-support-staff-manager .mado-support-card-kicker {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 6px 12px;
    border-radius: 999px;
    background: #ecf8fc;
    border: 1px solid #bfe9f5;
    color: #0f6e8c;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.02em;
    white-space: nowrap;
}
#mado-support-staff-manager .mado-support-account-editor {
    display: grid;
    gap: 12px;
    padding: 14px;
    border: 1px solid #d9e7ee;
    border-radius: 14px;
    background: #fbfdff;
}
#mado-support-staff-manager .mado-support-field { display:grid; gap:6px; }
#mado-support-staff-manager .mado-support-field__label,
#mado-support-staff-manager .mado-support-account-role-group__label {
    font-size: 12px;
    font-weight: 700;
    color: #475569;
}
#mado-support-staff-manager .mado-support-field__control {
    width:100%; min-height:44px; padding:10px 12px; box-sizing:border-box;
    border:1px solid #cfdbe4; border-radius:12px; background:#fff; color:var(--mado-support-text);
    font-size:14px; line-height:1.5;
    font-family: "Noto Sans JP", "Noto Sans", sans-serif;
}
#mado-support-staff-manager .mado-support-field__control::placeholder {
    font-family: "Noto Sans JP", "Noto Sans", sans-serif;
}
#mado-support-staff-manager select.mado-support-field__control,
#mado-support-staff-manager select.mado-support-field__control option {
    font-family: "Noto Sans JP", "Noto Sans", sans-serif;
}
#mado-support-staff-manager .mado-support-field__control:focus {
    outline:none; border-color:var(--mado-support-accent); box-shadow:0 0 0 3px rgba(20,179,227,0.14);
}
#mado-support-staff-manager .mado-support-account-role-grid { display:grid; gap:12px; }
#mado-support-staff-manager .mado-support-account-role-grid--invite { grid-template-columns:1fr; }
#mado-support-staff-manager .mado-support-account-role-option {
    display:grid; grid-template-columns:22px minmax(0,1fr); gap:12px; align-items:flex-start;
    padding:16px; border:1px solid #cfdbe4; border-radius:14px; background:#f8fcff; cursor:pointer;
}
#mado-support-staff-manager .mado-support-account-role-option.is-selected {
    border-color: var(--mado-support-accent); background: var(--mado-support-accent-soft); box-shadow:0 0 0 1px rgba(20,179,227,0.16);
}
#mado-support-staff-manager .mado-support-account-role-option input {
    width:18px; height:18px; margin:4px 0 0; accent-color:#14b3e3;
}
#mado-support-staff-manager .mado-support-account-role-option__body { display:grid; gap:6px; }
#mado-support-staff-manager .mado-support-account-role-option__title {
    display:block; font-size:15px; line-height:1.45; font-weight:800; color:var(--mado-support-text);
}
#mado-support-staff-manager .mado-support-account-role-option__hint {
    display:block; font-size:12px; line-height:1.75; color:var(--mado-support-muted);
}
#mado-support-staff-manager .mado-support-account-role-option.is-selected .mado-support-account-role-option__title {
    color:#0f6e8c;
}
#mado-support-staff-manager .mado-support-account-role-option.is-selected .mado-support-account-role-option__hint {
    color:#2b6f80;
}
#mado-support-staff-manager .mado-support-button-row { display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
#mado-support-staff-manager .mado-support-account-action-stack { display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
#mado-support-staff-manager .mado-support-account-action-stack .mado-support-inline-status { flex-basis:100%; }
#mado-support-staff-manager .button { border-radius:10px; min-height:40px; padding:0 16px; font-weight:700; }
#mado-support-staff-manager #mado-staff-create-submit,
#mado-support-staff-manager #mado-staff-edit-submit,
#mado-support-staff-manager #mado-staff-edit-cancel {
    font-family: "Noto Sans JP", "Noto Sans", sans-serif;
    letter-spacing: 0.03em;
}
#mado-support-staff-manager .button.button-primary,
#mado-support-staff-manager .mado-account-edit-btn,
#mado-support-staff-manager .mado-staff-edit-btn,
#mado-support-staff-manager #mado-account-activate-invite {
    border-color:#14b3e3; background:#14b3e3; color:#fff;
}
#mado-support-staff-manager .button.button-primary:hover,
#mado-support-staff-manager .mado-account-edit-btn:hover,
#mado-support-staff-manager .mado-staff-edit-btn:hover,
#mado-support-staff-manager #mado-account-activate-invite:hover {
    border-color:#0f9cc8; background:#0f9cc8;
}
#mado-support-staff-manager .mado-support-table-shell { overflow:auto; border:1px solid var(--mado-support-card-border); border-radius:16px; background:#fff; }
#mado-support-staff-manager .mado-support-table { width:100%; min-width:760px; border-collapse:collapse; }
#mado-support-staff-manager .mado-support-table--accounts { min-width:920px; }
#mado-support-staff-manager .mado-support-table--staff { min-width:1020px; }
#mado-support-staff-manager .mado-support-table thead th { white-space:nowrap; background:#f7fbfe; }
#mado-support-staff-manager .mado-support-table th,
#mado-support-staff-manager .mado-support-table td { padding:12px 14px; border-bottom:1px solid var(--mado-support-table-border); vertical-align:top; font-size:12px; }
#mado-support-staff-manager .mado-support-linked-cell { min-width:180px; white-space:normal; line-height:1.5; overflow-wrap:anywhere; word-break:break-word; }
#mado-support-staff-manager .mado-support-linked-cell__line + .mado-support-linked-cell__line { margin-top:4px; }
#mado-support-staff-manager .mado-support-linked-cell__empty { color:#64748b; }
#mado-support-staff-manager .mado-support-summary-card { padding:12px 14px; border:1px solid var(--mado-support-card-border-strong); border-radius:12px; background:#f8fbfd; }
#mado-support-staff-manager .mado-support-account-edit-current { padding:12px 14px; border:1px solid rgba(20,179,227,0.35); border-radius:12px; background:#f5fbfe; font-size:13px; font-weight:700; color:#0f6e8c; }
#mado-support-staff-manager .mado-support-inline-panel { display:grid; gap:10px; padding:12px 14px; border:1px solid var(--mado-support-card-border); border-radius:12px; background:#fbfdff; }
#mado-support-staff-manager .mado-support-checkbox-inline { display:flex; gap:10px; align-items:center; font-size:13px; font-weight:600; color:#334155; }
#mado-support-staff-manager .mado-support-checkbox-inline input { width:18px; height:18px; margin:0; accent-color:#14b3e3; }
#mado-support-staff-manager .mado-support-feature-permission-stack {
    display: grid;
    gap: 14px;
}
#mado-support-staff-manager .mado-support-permission-accordion {
    margin: 0;
}
#mado-support-staff-manager .mado-support-permission-accordion__summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    min-height: 74px;
    padding: 18px;
    cursor: pointer;
    list-style: none;
    background: #ffffff;
}
#mado-support-staff-manager .mado-support-permission-accordion__summary::-webkit-details-marker {
    display: none;
}
#mado-support-staff-manager .mado-support-permission-accordion__header {
    display: grid;
    gap: 4px;
    min-width: 0;
}
#mado-support-staff-manager .mado-support-permission-accordion__title-row {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}
#mado-support-staff-manager .mado-support-permission-accordion__title {
    margin: 0;
    font-size: 18px;
    line-height: 1.5;
    font-weight: 800;
    color: var(--mado-support-text);
}
#mado-support-staff-manager .mado-support-permission-accordion__description {
    margin: 0;
    font-size: 12px;
    line-height: 1.65;
    color: var(--mado-support-muted);
}
#mado-support-staff-manager .mado-support-permission-accordion__icon {
    flex: 0 0 auto;
    width: 28px;
    min-width: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #1f2937;
    font-size: 0;
    line-height: 1;
}
#mado-support-staff-manager .mado-support-permission-accordion__icon::before {
    content: "+";
    width: 28px;
    min-width: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 26px;
    font-family: "Noto Sans JP", "Arial Black", "Noto Sans", sans-serif;
    font-weight: 800;
    line-height: 1;
    letter-spacing: 0;
}
#mado-support-staff-manager .mado-support-permission-accordion[open] .mado-support-permission-accordion__icon::before {
    content: "\2212";
}
#mado-support-staff-manager .mado-support-permission-accordion__body {
    display: grid;
    gap: 14px;
    padding: 0 18px 16px;
    border-top: 1px solid #e2edf3;
}
#mado-support-staff-manager .mado-support-permission-groups {
    display: grid;
    gap: 14px;
}
#mado-support-staff-manager .mado-support-permission-group {
    display: grid;
    gap: 10px;
    padding: 12px;
    border: 1px solid #d8e6ee;
    border-radius: 12px;
    background: #ffffff;
}
#mado-support-staff-manager .mado-support-permission-group__title {
    margin: 0;
    font-size: 15px;
    line-height: 1.45;
    font-weight: 800;
    color: var(--mado-support-text);
}
#mado-support-staff-manager .mado-support-permission-group__description {
    margin: 2px 0 0;
    font-size: 12px;
    line-height: 1.55;
    color: var(--mado-support-muted);
}
#mado-support-staff-manager .mado-support-table-shell--permissions {
    border-color: #d8e6ee;
    border-radius: 12px;
}
#mado-support-staff-manager .mado-support-table--permissions {
    width: 100%;
    min-width: 900px;
    table-layout: fixed;
}
#mado-support-staff-manager .mado-support-table--permissions thead th {
    text-align: center;
    white-space: normal;
    line-height: 1.45;
}
#mado-support-staff-manager .mado-support-permission-column-link {
    color: #1f2937;
    text-decoration: none;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: color 0.16s ease;
}
#mado-support-staff-manager .mado-support-permission-column-link:hover,
#mado-support-staff-manager .mado-support-permission-column-link:focus,
#mado-support-staff-manager .mado-support-permission-column-link:focus-visible {
    color: #0b78ad;
    text-decoration: none;
}
#mado-support-staff-manager .mado-support-table--permissions thead th:first-child {
    text-align: left;
    width: 30%;
    min-width: 260px;
}
#mado-support-staff-manager .mado-support-table--permissions thead th:not(:first-child),
#mado-support-staff-manager .mado-support-table--permissions .mado-support-permission-cell {
    width: 17.5%;
}
#mado-support-staff-manager .mado-support-table--permissions th,
#mado-support-staff-manager .mado-support-table--permissions td {
    padding: 8px 10px;
}
#mado-support-staff-manager .mado-support-table--permissions tbody td {
    vertical-align: middle;
}
#mado-support-staff-manager .mado-support-permission-identity {
    width: 30%;
    min-width: 260px;
    padding-right: 12px;
}
#mado-support-staff-manager .mado-support-permission-identity__summary {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    min-height: 26px;
}
#mado-support-staff-manager .mado-support-permission-identity__label {
    font-size: 12px;
    line-height: 1.5;
    font-weight: 700;
    color: var(--mado-support-text);
    overflow-wrap: anywhere;
    word-break: break-word;
}
#mado-support-staff-manager .mado-support-permission-identity__label.is-empty {
    color: var(--mado-support-muted);
}
#mado-support-staff-manager .mado-support-permission-identity__status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 2px 8px;
    border-radius: 999px;
    background: #f1f5f9;
    color: #475569;
    font-size: 10px;
    line-height: 1.4;
    font-weight: 800;
}
#mado-support-staff-manager .mado-support-permission-identity__status--active {
    background: #ecfdf3;
    color: #0f9a54;
}
#mado-support-staff-manager .mado-support-permission-identity__status--invited {
    background: #fff7ed;
    color: #d97706;
}
#mado-support-staff-manager .mado-support-permission-identity__status--suspended {
    background: #fef2f2;
    color: #dc2626;
}
#mado-support-staff-manager .mado-support-permission-cell {
    text-align: center;
    vertical-align: middle;
}
#mado-support-staff-manager .mado-support-permission-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border: 1px solid #d1dde6;
    border-radius: 10px;
    background: #f8fcff;
    cursor: pointer;
}
#mado-support-staff-manager .mado-support-permission-toggle--readonly {
    cursor: default;
}
#mado-support-staff-manager .mado-support-permission-toggle__input {
    width: 16px;
    height: 16px;
    margin: 0;
    accent-color: #14b3e3;
}
#mado-support-staff-manager .mado-support-button-row--permissions {
    align-items: flex-start;
    gap: 8px;
}
@media (max-width: 920px) {
    #mado-support-staff-manager .mado-support-staff-layout {
        gap: 20px;
    }
    #mado-support-staff-manager .mado-support-section {
        gap: 18px;
        padding: 18px;
    }
    #mado-support-staff-manager .mado-support-section--staff {
        margin-top: 18px;
    }
    #mado-support-staff-manager .mado-support-account-tools,
    #mado-support-staff-manager .mado-support-split-grid { grid-template-columns:1fr; }
    #mado-support-staff-manager .mado-support-account-tools {
        gap: 20px;
    }
    #mado-support-staff-manager .mado-support-permission-group {
        padding: 12px;
    }
    #mado-support-staff-manager .mado-support-permission-accordion__summary {
        padding: 14px 14px 12px;
    }
    #mado-support-staff-manager .mado-support-permission-accordion__body {
        padding: 0 14px 14px;
    }
}


/* ===== MADO support staff font size tune 20260612 =====
 * Scope: support-staff page only.
 */

#mado-support-staff-manager .mado-support-summary-card {
    font-size: 12px;
}

#mado-support-staff-manager .mado-support-section__meta,
#mado-support-staff-manager .mado-support-section__status,
#mado-support-staff-manager .mado-support-inline-status {
    font-size: 11px;
}

#mado-support-staff-manager .mado-support-account-tool-card__title,
#mado-support-staff-manager .mado-support-form-card__title,
#mado-support-staff-manager .mado-support-permission-accordion__title {
    font-size: 17px;
}

/* ===== /MADO support staff font size tune 20260612 ===== */

/* ===== MADO support staff permission title font tune 20260612 =====
 * Scope: support-staff page only.
 */

#mado-support-staff-manager .mado-support-permission-accordion__title {
    font-size: 17px;
}

/* ===== /MADO support staff permission title font tune 20260612 ===== */

/* ===== MADO support staff section titles 17px 20260612 =====
 * Scope: support-staff page only.
 */

#mado-support-staff-manager .mado-support-section__title,
#mado-support-staff-manager .mado-support-permission-accordion__title {
    font-size: 17px;
}

/* ===== /MADO support staff section titles 17px 20260612 ===== */

/* ===== MADO support staff section title icons 20260612 =====
 * Scope: support-staff page only.
 */

#mado-support-staff-manager .mado-support-section--accounts .mado-support-section__title,
#mado-support-staff-manager .mado-support-section--staff .mado-support-section__title {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    font-size: 18px;
}

#mado-support-staff-manager .mado-support-permission-accordion__title {
    font-size: 18px;
}

#mado-support-staff-manager .mado-support-section--accounts .mado-support-section__title::before,
#mado-support-staff-manager .mado-support-section--staff .mado-support-section__title::before {
    content: "";
    display: inline-block;
    width: 19px;
    height: 19px;
    flex: 0 0 19px;
    background-color: currentColor;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: contain;
    mask-size: contain;
}

#mado-support-staff-manager .mado-support-section--accounts .mado-support-section__title::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'%3E%3Cpath d='M256 128C256 110.3 270.3 96 288 96L352 96C369.7 96 384 110.3 384 128L384 192C384 209.7 369.7 224 352 224L344 224L344 288L464 288C503.8 288 536 320.2 536 360L536 416L544 416C561.7 416 576 430.3 576 448L576 512C576 529.7 561.7 544 544 544L480 544C462.3 544 448 529.7 448 512L448 448C448 430.3 462.3 416 480 416L488 416L488 360C488 346.7 477.3 336 464 336L344 336L344 416L352 416C369.7 416 384 430.3 384 448L384 512C384 529.7 369.7 544 352 544L288 544C270.3 544 256 529.7 256 512L256 448C256 430.3 270.3 416 288 416L296 416L296 336L176 336C162.7 336 152 346.7 152 360L152 416L160 416C177.7 416 192 430.3 192 448L192 512C192 529.7 177.7 544 160 544L96 544C78.3 544 64 529.7 64 512L64 448C64 430.3 78.3 416 96 416L104 416L104 360C104 320.2 136.2 288 176 288L296 288L296 224L288 224C270.3 224 256 209.7 256 192L256 128z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'%3E%3Cpath d='M256 128C256 110.3 270.3 96 288 96L352 96C369.7 96 384 110.3 384 128L384 192C384 209.7 369.7 224 352 224L344 224L344 288L464 288C503.8 288 536 320.2 536 360L536 416L544 416C561.7 416 576 430.3 576 448L576 512C576 529.7 561.7 544 544 544L480 544C462.3 544 448 529.7 448 512L448 448C448 430.3 462.3 416 480 416L488 416L488 360C488 346.7 477.3 336 464 336L344 336L344 416L352 416C369.7 416 384 430.3 384 448L384 512C384 529.7 369.7 544 352 544L288 544C270.3 544 256 529.7 256 512L256 448C256 430.3 270.3 416 288 416L296 416L296 336L176 336C162.7 336 152 346.7 152 360L152 416L160 416C177.7 416 192 430.3 192 448L192 512C192 529.7 177.7 544 160 544L96 544C78.3 544 64 529.7 64 512L64 448C64 430.3 78.3 416 96 416L104 416L104 360C104 320.2 136.2 288 176 288L296 288L296 224L288 224C270.3 224 256 209.7 256 192L256 128z'/%3E%3C/svg%3E");
}

#mado-support-staff-manager .mado-support-section--staff .mado-support-section__title::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'%3E%3Cpath d='M96 192C96 130.1 146.1 80 208 80C269.9 80 320 130.1 320 192C320 253.9 269.9 304 208 304C146.1 304 96 253.9 96 192zM32 528C32 430.8 110.8 352 208 352C305.2 352 384 430.8 384 528L384 534C384 557.2 365.2 576 342 576L74 576C50.8 576 32 557.2 32 534L32 528zM464 128C517 128 560 171 560 224C560 277 517 320 464 320C411 320 368 277 368 224C368 171 411 128 464 128zM464 368C543.5 368 608 432.5 608 512L608 534.4C608 557.4 589.4 576 566.4 576L421.6 576C428.2 563.5 432 549.2 432 534L432 528C432 476.5 414.6 429.1 385.5 391.3C408.1 376.6 435.1 368 464 368z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'%3E%3Cpath d='M96 192C96 130.1 146.1 80 208 80C269.9 80 320 130.1 320 192C320 253.9 269.9 304 208 304C146.1 304 96 253.9 96 192zM32 528C32 430.8 110.8 352 208 352C305.2 352 384 430.8 384 528L384 534C384 557.2 365.2 576 342 576L74 576C50.8 576 32 557.2 32 534L32 528zM464 128C517 128 560 171 560 224C560 277 517 320 464 320C411 320 368 277 368 224C368 171 411 128 464 128zM464 368C543.5 368 608 432.5 608 512L608 534.4C608 557.4 589.4 576 566.4 576L421.6 576C428.2 563.5 432 549.2 432 534L432 528C432 476.5 414.6 429.1 385.5 391.3C408.1 376.6 435.1 368 464 368z'/%3E%3C/svg%3E");
}

/* ===== /MADO support staff section title icons 20260612 ===== */

/* ===== MADO support staff status badge color 20260612 =====
 * Scope: support-staff page only.
 */

#mado-support-staff-manager .mado-support-status-badge--active,
#mado-support-staff-manager .mado-support-permission-identity__status--active {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    max-width: 100%;
    padding: 3px 8px;
    border: 1px solid #bbf7d0;
    border-radius: 999px;
    background: #ecfdf5;
    color: #16a34a;
    font-size: 11px;
    font-weight: 800;
    line-height: 1.2;
    white-space: nowrap;
}

/* ===== /MADO support staff status badge color 20260612 ===== */

/* ===== MADO support staff invited badge and active switch 20260612 =====
 * Scope: support-staff page only.
 */

#mado-support-staff-manager .mado-support-status-badge--invited,
#mado-support-staff-manager .mado-support-permission-identity__status--invited {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    max-width: 100%;
    padding: 3px 8px;
    border: 1px solid #bae6fd;
    border-radius: 999px;
    background: #e0f2fe;
    color: #0284c7;
    font-size: 11px;
    font-weight: 800;
    line-height: 1.2;
    white-space: nowrap;
}

#mado-support-staff-manager .mado-support-checkbox-inline {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    width: fit-content;
    margin-top: 10px;
    margin-bottom: 2px;
    color: #0f172a;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.4;
    cursor: pointer;
}

#mado-support-staff-manager .mado-support-checkbox-inline input[type="checkbox"] {
    position: relative;
    appearance: none;
    -webkit-appearance: none;
    display: inline-flex;
    align-items: center;
    width: 52px;
    height: 28px;
    flex: 0 0 52px;
    margin: 0;
    padding: 0;
    border: 1px solid #cbd5e1;
    border-radius: 999px;
    background: #e2e8f0;
    box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.12);
    cursor: pointer;
    transition: background 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}

#mado-support-staff-manager .mado-support-checkbox-inline input[type="checkbox"]::before {
    content: "";
    position: absolute;
    top: 3px;
    left: 3px;
    width: 20px;
    height: 20px;
    border-radius: 999px;
    background: #ffffff;
    box-shadow: 0 2px 6px rgba(15, 23, 42, 0.24);
    transition: transform 0.18s ease;
}

#mado-support-staff-manager .mado-support-checkbox-inline input[type="checkbox"]:checked {
    border-color: #10b981;
    background: #14b8a6;
}

#mado-support-staff-manager .mado-support-checkbox-inline input[type="checkbox"]:checked::before {
    transform: translateX(24px);
}

#mado-support-staff-manager .mado-support-checkbox-inline input[type="checkbox"]:focus-visible {
    outline: 3px solid rgba(20, 184, 166, 0.22);
    outline-offset: 2px;
}

#mado-support-staff-manager .mado-support-checkbox-inline input[type="checkbox"]:disabled {
    cursor: not-allowed;
    opacity: 0.55;
}

#mado-support-staff-manager .mado-support-checkbox-inline input[type="checkbox"]:disabled + span {
    opacity: 0.65;
}

/* ===== /MADO support staff invited badge and active switch 20260612 ===== */

/* ===== MADO support staff final UI tune 20260612 =====
 * Scope: support-staff page only.
 */

/* Buttons: 1px smaller and a little lighter */
#mado-support-staff-manager #mado-staff-create-submit,
#mado-support-staff-manager #mado-staff-edit-submit,
#mado-support-staff-manager #mado-staff-edit-cancel,
#mado-support-staff-manager #mado-feature-permissions-save,
#mado-support-staff-manager #mado-feature-permissions-reset {
    font-size: 13px;
    font-weight: 700;
    line-height: 1.2;
}

/* Add a little vertical breathing room before selected staff fields */
#mado-support-staff-manager label.mado-support-field:has(#mado-staff-create-name-native),
#mado-support-staff-manager label.mado-support-field:has(#mado-staff-create-name-latin),
#mado-support-staff-manager label.mado-support-field:has(#mado-staff-create-linked-account-id),
#mado-support-staff-manager label.mado-support-field:has(#mado-staff-edit-name-native),
#mado-support-staff-manager label.mado-support-field:has(#mado-staff-edit-name-latin),
#mado-support-staff-manager label.mado-support-field:has(#mado-staff-edit-linked-account-id) {
    margin-top: 6px;
}

/* Selected staff field labels: slightly smaller */
#mado-support-staff-manager label.mado-support-field:has(#mado-staff-create-name-native) .mado-support-field__label,
#mado-support-staff-manager label.mado-support-field:has(#mado-staff-create-name-latin) .mado-support-field__label,
#mado-support-staff-manager label.mado-support-field:has(#mado-staff-create-linked-account-id) .mado-support-field__label,
#mado-support-staff-manager label.mado-support-field:has(#mado-staff-edit-name-native) .mado-support-field__label,
#mado-support-staff-manager label.mado-support-field:has(#mado-staff-edit-name-latin) .mado-support-field__label,
#mado-support-staff-manager label.mado-support-field:has(#mado-staff-edit-linked-account-id) .mado-support-field__label {
    font-size: 12px;
    line-height: 1.45;
}

/* Permission groups: remove extra surrounding frames to avoid triple borders */
#mado-support-staff-manager .mado-support-permission-group {
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
}

#mado-support-staff-manager .mado-support-table-shell--permissions {
    border: 0;
    border-radius: 0;
    background: transparent;
}

/* Keep spacing after removing the group frame */
#mado-support-staff-manager .mado-support-permission-group__header {
    margin-bottom: 8px;
}

/* ===== /MADO support staff final UI tune 20260612 ===== */

/* ===== MADO support staff final spacing cleanup 20260612 =====
 * Scope: support-staff page only.
 */

/* Remove the outer frame around the account role editor area */
#mado-support-staff-manager .mado-support-account-editor {
    border: 0;
    border-radius: 0;
    background: transparent;
    padding: 0;
}

/* Buttons: restore 1px after previous downsize */
#mado-support-staff-manager #mado-staff-create-submit,
#mado-support-staff-manager #mado-staff-edit-submit,
#mado-support-staff-manager #mado-staff-edit-cancel,
#mado-support-staff-manager #mado-feature-permissions-save,
#mado-support-staff-manager #mado-feature-permissions-reset {
    font-size: 14px;
    font-weight: 700;
}

/* Add top spacing before first feature permission heading */
#mado-support-staff-manager .mado-support-permission-group[data-feature-permission-group="operations"] {
    margin-top: 16px;
}

/* Keep permission groups from becoming triple-framed */
#mado-support-staff-manager .mado-support-permission-group {
    border: 0;
    background: transparent;
    box-shadow: none;
}

#mado-support-staff-manager .mado-support-table-shell--permissions {
    border: 0;
    background: transparent;
    box-shadow: none;
}

/* Moved helper text into labels, so keep long labels readable */
#mado-support-staff-manager label.mado-support-field:has(#mado-staff-create-staff-no) .mado-support-field__label,
#mado-support-staff-manager label.mado-support-field:has(#mado-staff-create-name-native) .mado-support-field__label,
#mado-support-staff-manager label.mado-support-field:has(#mado-staff-edit-staff-no) .mado-support-field__label,
#mado-support-staff-manager label.mado-support-field:has(#mado-staff-edit-name-native) .mado-support-field__label {
    font-size: 12px;
    line-height: 1.45;
}

/* ===== /MADO support staff final spacing cleanup 20260612 ===== */

/* ===== MADO support staff final label and frame tune 20260612 =====
 * Scope: support-staff page only.
 */

/* Remove the outer frame around account role editor */
#mado-support-staff-manager #mado-account-role-settings-accordion .mado-support-feature-permission-stack,
#mado-support-staff-manager .mado-support-account-editor {
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    padding: 0;
}

/* Keep the actual role choices as cards */
#mado-support-staff-manager .mado-support-account-role-group {
    margin-top: 14px;
}

/* Restore button text by 1px after the previous downsize */
#mado-support-staff-manager #mado-staff-create-submit,
#mado-support-staff-manager #mado-staff-edit-submit,
#mado-support-staff-manager #mado-staff-edit-cancel,
#mado-support-staff-manager #mado-account-edit-submit,
#mado-support-staff-manager #mado-account-edit-cancel,
#mado-support-staff-manager #mado-feature-permissions-save,
#mado-support-staff-manager #mado-feature-permissions-reset {
    font-size: 14px;
    font-weight: 700;
}

/* Add spacing above CSV permission group */
#mado-support-staff-manager .mado-support-permission-group[data-feature-permission-group="operations"] {
    margin-top: 18px;
}

/* Reduce triple-border feeling around feature permission tables */
#mado-support-staff-manager .mado-support-permission-group {
    border: 0;
    background: transparent;
    box-shadow: none;
}

#mado-support-staff-manager .mado-support-table-shell--permissions {
    border: 0;
    background: transparent;
    box-shadow: none;
}

/* Label notes in parentheses */
#mado-support-staff-manager label.mado-support-field:has(#mado-staff-create-staff-no) .mado-support-field__label,
#mado-support-staff-manager label.mado-support-field:has(#mado-staff-create-name-native) .mado-support-field__label,
#mado-support-staff-manager label.mado-support-field:has(#mado-staff-edit-staff-no) .mado-support-field__label,
#mado-support-staff-manager label.mado-support-field:has(#mado-staff-edit-name-native) .mado-support-field__label {
    display: inline-flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 3px;
    margin-bottom: 7px;
    font-size: 12px;
    line-height: 1.45;
}

#mado-support-staff-manager .mado-support-field__label-note {
    color: #64748b;
    font-size: 12px;
    font-weight: 600;
}

/* Keep a bit of breathing room under moved labels */
#mado-support-staff-manager label.mado-support-field:has(#mado-staff-create-staff-no),
#mado-support-staff-manager label.mado-support-field:has(#mado-staff-create-name-native),
#mado-support-staff-manager label.mado-support-field:has(#mado-staff-edit-staff-no),
#mado-support-staff-manager label.mado-support-field:has(#mado-staff-edit-name-native) {
    gap: 6px;
}

/* ===== /MADO support staff final label and frame tune 20260612 ===== */

/* ===== MADO support staff field spacing position fix 20260612 =====
 * Scope: support-staff page only.
 */

/* Keep labels close to their own input */
#mado-support-staff-manager label.mado-support-field:has(#mado-staff-create-staff-no),
#mado-support-staff-manager label.mado-support-field:has(#mado-staff-create-name-native),
#mado-support-staff-manager label.mado-support-field:has(#mado-staff-create-name-latin),
#mado-support-staff-manager label.mado-support-field:has(#mado-staff-edit-staff-no),
#mado-support-staff-manager label.mado-support-field:has(#mado-staff-edit-name-native),
#mado-support-staff-manager label.mado-support-field:has(#mado-staff-edit-name-latin) {
    row-gap: 3px;
    gap: 3px;
}

/* Remove the extra space under the label text itself */
#mado-support-staff-manager label.mado-support-field:has(#mado-staff-create-staff-no) .mado-support-field__label,
#mado-support-staff-manager label.mado-support-field:has(#mado-staff-create-name-native) .mado-support-field__label,
#mado-support-staff-manager label.mado-support-field:has(#mado-staff-edit-staff-no) .mado-support-field__label,
#mado-support-staff-manager label.mado-support-field:has(#mado-staff-edit-name-native) .mado-support-field__label {
    margin-bottom: 0;
    padding-bottom: 0;
}

/* Put spacing after the input field, before the next field starts */
#mado-support-staff-manager label.mado-support-field:has(#mado-staff-create-staff-no),
#mado-support-staff-manager label.mado-support-field:has(#mado-staff-create-name-native),
#mado-support-staff-manager label.mado-support-field:has(#mado-staff-edit-staff-no),
#mado-support-staff-manager label.mado-support-field:has(#mado-staff-edit-name-native) {
    margin-bottom: 12px;
}

/* The Latin field starts after the display-name spacing, so do not add extra top space here */
#mado-support-staff-manager label.mado-support-field:has(#mado-staff-create-name-latin),
#mado-support-staff-manager label.mado-support-field:has(#mado-staff-edit-name-latin) {
    margin-top: 0;
}

/* Keep the gray note compact beside the main label */
#mado-support-staff-manager .mado-support-field__label-note {
    margin-left: 2px;
    color: #64748b;
    font-size: 12px;
    font-weight: 600;
}

/* ===== /MADO support staff field spacing position fix 20260612 ===== */

/* ===== MADO support staff role and sort spacing 20260612 =====
 * Scope: support-staff page only.
 */

/* Add breathing room above role level and sort order fields */
#mado-support-staff-manager label.mado-support-field:has(#mado-staff-create-role-level),
#mado-support-staff-manager label.mado-support-field:has(#mado-staff-edit-role-level),
#mado-support-staff-manager label.mado-support-field:has(#mado-staff-create-sort-order),
#mado-support-staff-manager label.mado-support-field:has(#mado-staff-edit-sort-order) {
    margin-top: 10px;
}

/* ===== /MADO support staff role and sort spacing 20260612 ===== */


/* ===== MADO support staff semantic/WCAG layout 20260710 ===== */
.mado-support-staff-alert {
    max-width: 720px;
    padding: 16px;
    border: 1px solid #f59e0b;
    border-radius: 10px;
    background: #fff8e6;
    color: #7c2d12;
}

.mado-support-staff-alert__actions {
    margin-top: 12px;
}

.mado-support-staff-page,
.mado-support-staff-page *,
.mado-support-staff-page *::before,
.mado-support-staff-page *::after {
    box-sizing: border-box;
}

.mado-support-staff-page {
    --mado-support-staff-water: #2eb2c1;
    --mado-support-staff-water-dark: #0b6870;
    --mado-support-staff-water-hover: #2197a5;
    --mado-support-staff-water-soft: #e9f9fb;
    --mado-support-staff-water-surface: #f3fcfd;
    --mado-support-staff-water-border: #8ad8e1;
    width: 100%;
    max-width: 1140px;
    min-width: 0;
    margin-left: auto;
    margin-right: auto;
}

.mado-support-staff-page .screen-reader-text {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.mado-support-staff-capabilities {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-bottom: 16px;
}

.mado-support-staff-capability {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 4px 10px;
    border: 1px solid;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.4;
}

.mado-support-staff-capability.is-editable {
    border-color: #bbf7d0;
    background: #ecfdf3;
    color: #166534;
}

.mado-support-staff-capability.is-readonly {
    border-color: #fcd34d;
    background: #fffbeb;
    color: #92400e;
}

.mado-support-staff-page__panel {
    display: grid;
    gap: 18px;
    width: 100%;
    min-width: 0;
    padding: 20px;
    border: 1px solid #d9e4ef;
    border-radius: 16px;
    background: #ffffff;
    box-shadow: 0 12px 30px rgba(15, 23, 42, 0.05);
}

.mado-support-staff-page__header {
    display: grid;
    gap: 6px;
}

.mado-support-staff-page__title {
    margin: 0;
    color: #0f172a;
    font-size: var(--mado-portal-heading-page-size, 22px);
    font-weight: var(--mado-portal-heading-weight, 800);
    line-height: var(--mado-portal-heading-line-height, 1.5);
}

.mado-support-staff-page__lead {
    max-width: 760px;
    margin: 0;
    color: var(--mado-support-muted);
    font-size: 14px;
    line-height: 1.75;
}

.mado-support-staff-guides {
    display: grid;
    gap: 10px;
}

.mado-staff-guide-accordion {
    margin: 0;
    border: 0;
    border-radius: 10px;
    background: var(--mado-support-staff-water-surface);
}

.mado-staff-guide-accordion__summary {
    display: list-item;
    min-height: 48px;
    padding: 13px 15px;
    border: 1px solid var(--mado-support-staff-water-border);
    border-radius: 10px;
    background: var(--mado-support-staff-water-soft);
    color: var(--mado-support-staff-water-dark);
    font-size: 14px;
    font-weight: 800;
    line-height: 1.55;
    cursor: pointer;
}

.mado-staff-guide-accordion[open] > .mado-staff-guide-accordion__summary {
    border-radius: 10px 10px 0 0;
}

.mado-staff-guide-accordion__summary:hover {
    border-color: var(--mado-support-staff-water);
    background: #dff7f9;
}

.mado-staff-guide-accordion__summary:focus-visible,
.mado-support-staff-page button:focus-visible,
.mado-support-staff-page a:focus-visible,
.mado-support-staff-page input:focus-visible,
.mado-support-staff-page select:focus-visible,
.mado-support-staff-page textarea:focus-visible {
    outline: 3px solid rgba(46, 178, 193, 0.3);
    outline-offset: 2px;
}

.mado-staff-guide-accordion__body {
    padding: 12px 15px 15px;
    border: 1px solid #9fcbd1;
    border-top: 0;
    border-radius: 0 0 10px 10px;
    background: #f8fdfe;
    color: #334155;
    font-size: 13px;
    line-height: 1.85;
}

.mado-staff-guide-accordion__body p {
    margin: 0 0 10px;
}

.mado-staff-guide-accordion__body p:last-child,
.mado-staff-guide-accordion__body li:last-child {
    margin-bottom: 0;
}

.mado-staff-guide-accordion__body ul {
    margin: 0 0 12px;
    padding-left: 22px;
}

.mado-staff-guide-accordion__body li {
    margin-bottom: 8px;
}

.mado-staff-guide-accordion__body li > div {
    margin-top: 4px;
    margin-left: 14px;
}

.mado-staff-guide-accordion__body hr {
    margin: 12px 0;
    border: 0;
    border-top: 1px solid #c7dde2;
}

.mado-staff-guide-accordion__body br + span {
    display: inline-block;
    margin-left: 14px;
}

.mado-staff-guide-accordion__body > div:first-of-type {
    overflow-x: auto;
    margin-bottom: 12px;
    border: 1px solid #9fcbd1;
    border-radius: 8px;
    background: #ffffff;
}

.mado-support-staff-guide-table {
    width: 100%;
    min-width: 700px;
    border-collapse: collapse;
    font-size: 13px;
}

.mado-support-staff-guide-table thead {
    background: #eefbfc;
}

.mado-support-staff-guide-table th,
.mado-support-staff-guide-table td {
    padding: 8px 10px;
    border-top: 1px solid #dbe8ec;
    text-align: left;
}

.mado-support-staff-guide-table thead th {
    border-top: 0;
    border-bottom: 1px solid #b9d5db;
}

.mado-support-staff-guide-table th + th,
.mado-support-staff-guide-table td + td {
    text-align: center;
}

.mado-support-staff-login-context {
    margin: 0;
    color: #64748b;
    font-size: 12px;
    line-height: 1.7;
}

#mado-support-staff-manager.mado-support-staff-manager-root {
    margin-top: 14px;
}

#mado-support-staff-manager .mado-support-section__title {
    font-size: var(--mado-portal-heading-section-size, 18px);
    line-height: var(--mado-portal-heading-line-height, 1.5);
}

#mado-support-staff-manager .mado-support-permission-accordion__title,
#mado-support-staff-manager .mado-support-form-card__title {
    font-size: 17px;
    line-height: 1.5;
}

#mado-support-staff-manager .mado-support-permission-group__title {
    font-size: 15px;
    line-height: 1.5;
}

#mado-support-staff-manager .mado-support-section__status,
#mado-support-staff-manager .mado-support-inline-status {
    min-height: 1.5em;
}

#mado-support-staff-manager .mado-support-button-row--actions-end {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    width: 100%;
}

#mado-support-staff-manager .mado-support-button-group {
    display: inline-flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px;
}

#mado-support-staff-manager #mado-account-invite-submit,
#mado-support-staff-manager #mado-staff-create-submit,
#mado-support-staff-manager #mado-staff-edit-submit,
#mado-support-staff-manager #mado-staff-edit-cancel {
    min-height: 44px;
    padding: 0 18px;
    font-size: 14px;
    line-height: 1.4;
}

@media (max-width: 680px) {
    .mado-support-staff-page__panel {
        padding: 16px;
    }

    #mado-support-staff-manager .mado-support-button-row--actions-end {
        grid-template-columns: 1fr;
    }

    #mado-support-staff-manager .mado-support-button-group {
        width: 100%;
    }

    #mado-support-staff-manager .mado-support-button-group .button {
        flex: 1 1 160px;
    }
}


#mado-support-staff-manager fieldset.mado-support-account-role-group {
    min-width: 0;
    margin: 14px 0 0;
    padding: 0;
    border: 0;
}

#mado-support-staff-manager fieldset.mado-support-account-role-group > legend {
    margin: 0 0 8px;
    padding: 0;
}

#mado-support-staff-manager .mado-support-single-owner-notice {
    margin-top: 10px;
    padding: 10px 12px;
    border: 1px solid #f6b94a;
    border-radius: 10px;
    background: #fff7e8;
    color: #a34b00;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.7;
}

#mado-support-staff-manager .mado-support-account-role-note {
    display: block;
    margin-top: 4px;
    color: #a34b00;
    font-size: 11px;
    line-height: 1.5;
}

#mado-support-staff-manager .mado-support-account-role-option.is-unavailable {
    cursor: not-allowed;
    opacity: 0.58;
}

#mado-support-staff-manager .mado-support-action-unavailable {
    color: #94a3b8;
}

#mado-support-staff-manager .mado-support-section__status[data-state="error"],
#mado-support-staff-manager .mado-support-inline-status[data-state="error"] {
    color: #b42318;
}

#mado-support-staff-manager .mado-support-section__status[data-state="success"],
#mado-support-staff-manager .mado-support-inline-status[data-state="success"] {
    color: #16794a;
}

#mado-support-staff-manager .mado-support-section__status[data-state="warning"],
#mado-support-staff-manager .mado-support-inline-status[data-state="warning"] {
    color: #a34b00;
}

/* ===== /MADO support staff semantic/WCAG layout 20260710 ===== */

/* ===== MADO minimal staff invite acceptance 2026-07-30 =====
 * Pre-membership view only. The normal private portal shell is intentionally
 * not rendered until the invitation has been activated.
 */
body.mado-portal-standalone--minimal.mado-portal-standalone--support-staff-invite {
    min-height: 100vh;
    margin: 0;
    display: grid;
    place-items: center;
    background: #f5f8fb;
}

.mado-support-staff-page--invite {
    box-sizing: border-box;
    width: 100%;
    margin: 0 auto;
    padding: clamp(18px, 4vh, 36px) 16px;
}

/*
 * 2026-07-30: The invite confirmation itself is a compact standalone card.
 * Constrain the card directly instead of relying on the shared portal container,
 * because global container sizing may expand to the full viewport.
 */
.mado-support-staff-page--invite .mado-support-staff-invite-card {
    box-sizing: border-box;
    display: grid;
    gap: 18px;
    width: min(100%, 480px);
    margin: 0 auto;
    padding: clamp(22px, 3vw, 28px);
    border: 0;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 18px 48px rgba(15, 23, 42, 0.1);
}

.mado-support-staff-page--invite .mado-support-staff-invite-card h1,
.mado-support-staff-page--invite .mado-support-staff-invite-card p {
    margin: 0;
}

.mado-support-staff-page--invite .mado-support-staff-invite-card h1 {
    font-size: clamp(19px, 2.2vw, 22px);
    line-height: 1.4;
    text-align: center;
}

.mado-support-staff-page--invite .mado-support-button-row {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    flex-wrap: wrap;
}

.mado-support-staff-page--invite .mado-support-staff-invite-card .button.button-primary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    padding: 0 18px;
    border: 1px solid #14b3e3;
    border-radius: 10px;
    background: #14b3e3;
    color: #ffffff;
    box-shadow: none;
    text-decoration: none;
    font-weight: 700;
    line-height: 1.2;
}

.mado-support-staff-page--invite .mado-support-staff-invite-card .button.button-primary:hover,
.mado-support-staff-page--invite .mado-support-staff-invite-card .button.button-primary:focus-visible {
    border-color: #0f9cc8;
    background: #0f9cc8;
    color: #ffffff;
    text-decoration: none;
}

.mado-support-staff-page--invite .mado-support-invite-summary {
    display: grid;
    gap: 0;
    margin: 0;
    overflow: hidden;
    border: 1px solid #d9e7ee;
    border-radius: 12px;
}

.mado-support-staff-page--invite .mado-support-invite-summary > div {
    display: grid;
    grid-template-columns: minmax(120px, 0.35fr) minmax(0, 1fr);
    gap: 16px;
    padding: 12px 14px;
    border-bottom: 1px solid #e5edf3;
}

.mado-support-staff-page--invite .mado-support-invite-summary > div:last-child {
    border-bottom: 0;
}

.mado-support-staff-page--invite .mado-support-invite-summary dt {
    font-weight: 700;
}

.mado-support-staff-page--invite .mado-support-invite-summary dd {
    min-width: 0;
    margin: 0;
    overflow-wrap: anywhere;
}

.mado-support-staff-page--invite .mado-support-staff-alert {
    box-sizing: border-box;
    width: 100%;
    max-width: 400px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

.mado-support-self-profile {
    display: grid;
    gap: 18px;
    margin-top: 22px;
    padding: 22px;
    border: 1px solid #d9e7ee;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.05);
}

.mado-support-self-profile__header {
    display: grid;
    gap: 6px;
}

.mado-support-self-profile__header h2,
.mado-support-self-profile__header p,
.mado-support-self-profile__manager-note {
    margin: 0;
}

.mado-support-self-profile__header h2 {
    font-size: 18px;
    line-height: 1.45;
}

.mado-support-self-profile__header p,
.mado-support-self-profile__manager-note {
    color: #5b6b7e;
    font-size: 12px;
    line-height: 1.75;
}

#mado-support-staff-manager.mado-support-staff-manager-root--self-profile {
    gap: 16px;
}

@media (max-width: 560px) {
    .mado-support-staff-page--invite .mado-support-invite-summary > div {
        grid-template-columns: 1fr;
        gap: 4px;
    }
}
/* ===== /MADO minimal staff invite acceptance 2026-07-30 ===== */

/*
 * 2026-07-30: Pending invite lifecycle controls.
 * These buttons call the single 015-owned reissue/cancel routes; do not add a
 * second invite renderer or duplicate token logic in CSS/JS/PHP.
 */
#mado-support-staff-manager .mado-support-table--accounts {
    min-width: 1120px;
}

#mado-support-staff-manager .mado-support-invite-action-cell {
    min-width: 250px;
}

#mado-support-staff-manager .mado-support-invite-actions {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 7px;
}

#mado-support-staff-manager .mado-support-invite-actions__buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

#mado-support-staff-manager .mado-support-invite-action-button.button {
    min-height: 32px;
    padding: 0 10px;
    border-radius: 8px;
    font-size: 12px;
    line-height: 1.2;
}

#mado-support-staff-manager .mado-support-invite-action-button--cancel.button {
    border-color: #d7a3a3;
    color: #a12f2f;
    background: #fffafa;
}

#mado-support-staff-manager .mado-support-invite-action-button--cancel.button:hover,
#mado-support-staff-manager .mado-support-invite-action-button--cancel.button:focus-visible {
    border-color: #b84b4b;
    color: #842020;
    background: #fff3f3;
}

#mado-support-staff-manager .mado-support-invite-action__expiry,
#mado-support-staff-manager .mado-support-invite-action__canceled {
    color: #65768a;
    font-size: 11px;
    line-height: 1.45;
}



/*
 * 2026-07-30: Non-manager staff see only their own role summary. The full
 * organization and staff-management interfaces are not merely disabled; they
 * are not rendered to operators.
 */
.mado-support-staff-access-summary {
    display: grid;
    gap: 10px;
    max-width: 720px;
    margin: 20px auto 0;
    padding: 20px;
    border: 1px solid #cfe1ea;
    border-radius: 16px;
    background: #ffffff;
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.06);
}

.mado-support-staff-access-summary h2,
.mado-support-staff-access-summary p {
    margin: 0;
}

.mado-support-staff-access-summary h2 {
    font-size: 18px;
    line-height: 1.45;
}

.mado-support-staff-access-summary p {
    font-size: 14px;
    line-height: 1.75;
}

.mado-support-staff-access-summary .mado-support-button-row {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 4px;
}

.mado-support-staff-access-summary .button.button-primary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    padding: 0 18px;
    border: 1px solid #14b3e3;
    border-radius: 10px;
    background: #14b3e3;
    color: #ffffff;
    box-shadow: none;
    text-decoration: none;
    font-weight: 700;
    line-height: 1.2;
}

.mado-support-staff-access-summary .button.button-primary:hover,
.mado-support-staff-access-summary .button.button-primary:focus-visible {
    border-color: #0f9cc8;
    background: #0f9cc8;
    color: #ffffff;
    text-decoration: none;
}