.concierge-nav.is-supervision {
    background: linear-gradient(100deg, #082f43, var(--concierge-primary));
    border-bottom: 3px solid #d5a84b;
}

.concierge-supervision-badge {
    flex: 0 0 auto;
    border: 1px solid rgba(255, 255, 255, .45);
    border-radius: 999px;
    padding: 7px 11px;
    color: #173e4a;
    background: #f5d98e;
    font-size: .68rem;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.concierge-supervision-hero {
    display: grid;
    grid-template-columns: 1fr 240px;
    gap: 18px;
    align-items: stretch;
    border-radius: 26px;
    padding: 25px;
    color: #fff;
    background: linear-gradient(135deg, #082f43, var(--concierge-primary));
    box-shadow: 0 18px 45px rgba(12, 61, 74, .2);
}

.concierge-supervision-hero h1,
.concierge-supervision-hero p { margin: .3rem 0; }
.concierge-supervision-hero > div > span {
    color: #f5d98e;
    font-size: .72rem;
    font-weight: 900;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.concierge-supervision-stats,
.concierge-supervision-actions {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin: 16px 0;
}

.concierge-supervision-stats a,
.concierge-supervision-actions a {
    border: 1px solid rgba(21, 64, 74, .12);
    border-radius: 17px;
    padding: 16px;
    color: inherit;
    background: var(--concierge-card);
    text-decoration: none;
    box-shadow: 0 8px 24px rgba(35, 57, 61, .06);
}

.concierge-supervision-stats small,
.concierge-supervision-stats strong,
.concierge-supervision-actions strong,
.concierge-supervision-actions span { display: block; }
.concierge-supervision-stats small { color: var(--concierge-muted); }
.concierge-supervision-stats strong { margin-top: 5px; font-size: 2rem; }
.concierge-supervision-actions strong { color: var(--concierge-primary); }
.concierge-supervision-actions span { margin-top: 5px; color: var(--concierge-muted); font-size: .82rem; }

.concierge-section-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 13px;
}
.concierge-section-heading h2 { margin: .2rem 0; }
.concierge-section-heading a { color: var(--concierge-primary); font-weight: 800; }

.concierge-supervision-table { overflow-x: auto; }
.concierge-supervision-table table { width: 100%; border-collapse: collapse; }
.concierge-supervision-table th,
.concierge-supervision-table td { border-bottom: 1px solid #dde5e1; padding: 11px; text-align: left; }
.concierge-supervision-table th { color: var(--concierge-muted); font-size: .7rem; text-transform: uppercase; }
.concierge-supervision-table td strong,
.concierge-supervision-table td small { display: block; }
.concierge-supervision-table td small { color: var(--concierge-muted); }
.concierge-supervision-table td > a { color: var(--concierge-primary); font-weight: 800; }

.concierge-worker-supervision-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
}
.concierge-worker-supervision-grid > article {
    display: flex;
    align-items: center;
    gap: 10px;
    border-radius: 14px;
    padding: 12px;
    color: inherit;
    background: #edf2ef;
}
.concierge-worker-supervision-grid > article > span {
    display: grid;
    flex: 0 0 42px;
    place-items: center;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    color: #fff;
    background: var(--concierge-primary);
    font-weight: 900;
}
.concierge-worker-supervision-grid > article > div { min-width: 0; flex: 1; }
.concierge-worker-supervision-grid > article > a {
    flex: 0 0 auto;
    border-radius: 9px;
    padding: 8px 10px;
    color: #fff;
    background: var(--concierge-primary);
    font-size: .72rem;
    font-weight: 850;
    text-decoration: none;
}
.concierge-worker-supervision-grid strong,
.concierge-worker-supervision-grid small,
.concierge-worker-supervision-grid em { display: block; }
.concierge-worker-supervision-grid small { color: var(--concierge-muted); }
.concierge-worker-supervision-grid em { color: var(--concierge-secondary); font-size: .72rem; font-style: normal; font-weight: 800; }

.concierge-supervision-columns {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    margin-top: 16px;
}

@media (max-width: 900px) {
    .concierge-nav.is-supervision { align-items: flex-start; flex-wrap: wrap; }
    .concierge-nav.is-supervision nav { order: 3; flex-basis: 100%; overflow-x: auto; }
    .concierge-supervision-stats,
    .concierge-supervision-actions { grid-template-columns: 1fr 1fr; }
    .concierge-worker-supervision-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 600px) {
    .concierge-supervision-badge { width: 100%; text-align: center; }
    .concierge-supervision-hero,
    .concierge-supervision-stats,
    .concierge-supervision-actions,
    .concierge-worker-supervision-grid,
    .concierge-supervision-columns { grid-template-columns: 1fr; }
    .concierge-section-heading { align-items: flex-start; flex-direction: column; }
}