.fss-status {
    --fss-purple: #6338e5;
    --fss-green: #18794e;
    --fss-yellow: #9a6700;
    --fss-orange: #bc4c00;
    --fss-red: #cf222e;
    --fss-gray: #57606a;
    --fss-border: #d0d7de;
    --fss-surface: #ffffff;
    --fss-muted: #f6f8fa;
    margin: 1.5rem 0;
    padding: clamp(1rem, 3vw, 1.5rem);
    border: 1px solid var(--fss-border);
    border-radius: 16px;
    background: var(--fss-surface);
    color: #24292f;
    box-shadow: 0 8px 24px rgba(140, 149, 159, 0.14);
}

.fss-status__title,
.fss-status h3,
.fss-status h4,
.fss-status p {
    margin-top: 0;
}

.fss-status__title {
    margin-bottom: 1rem;
    color: #11172a;
    font-size: clamp(1.25rem, 4vw, 1.65rem);
}

.fss-status__summary {
    display: flex;
    gap: 0.85rem;
    align-items: flex-start;
    padding: 1rem;
    border-left: 5px solid var(--fss-gray);
    border-radius: 10px;
    background: var(--fss-muted);
}

.fss-status__indicator {
    flex: 0 0 auto;
    width: 0.85rem;
    height: 0.85rem;
    margin-top: 0.3rem;
    border-radius: 50%;
    background: var(--fss-gray);
    box-shadow: 0 0 0 4px rgba(87, 96, 106, 0.15);
}

.fss-status__summary--operational { border-left-color: var(--fss-green); }
.fss-status__summary--operational .fss-status__indicator { background: var(--fss-green); }
.fss-status__summary--under_maintenance { border-left-color: var(--fss-yellow); }
.fss-status__summary--under_maintenance .fss-status__indicator { background: var(--fss-yellow); }
.fss-status__summary--degraded_performance { border-left-color: var(--fss-orange); }
.fss-status__summary--degraded_performance .fss-status__indicator { background: var(--fss-orange); }
.fss-status__summary--partial_outage,
.fss-status__summary--major_outage { border-left-color: var(--fss-red); }
.fss-status__summary--partial_outage .fss-status__indicator,
.fss-status__summary--major_outage .fss-status__indicator { background: var(--fss-red); }

.fss-status__headline {
    margin-bottom: 0.25rem;
    font-size: 1.1rem;
    font-weight: 700;
}

.fss-status__message,
.fss-status__checked,
.fss-status__notice-date {
    color: #57606a;
}

.fss-status__message { margin-bottom: 0; }

.fss-status__warning {
    margin-bottom: 0.85rem;
    padding: 0.75rem 0.9rem;
    border: 1px solid #d4a72c;
    border-radius: 8px;
    background: #fff8c5;
    color: #633c01;
    font-weight: 600;
}

.fss-status__services,
.fss-status__notices {
    margin-top: 1.25rem;
}

.fss-status__services h3,
.fss-status__notices h3 {
    margin-bottom: 0.75rem;
    font-size: 1.05rem;
}

.fss-status__services ul {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0;
    margin: 0;
    padding: 0;
    border: 1px solid var(--fss-border);
    border-radius: 10px;
    list-style: none;
    overflow: hidden;
}

.fss-status__services li {
    display: flex;
    gap: 0.75rem;
    align-items: center;
    justify-content: space-between;
    min-width: 0;
    padding: 0.75rem 0.9rem;
    border-bottom: 1px solid var(--fss-border);
}

.fss-status__services li:nth-child(odd) { border-right: 1px solid var(--fss-border); }
.fss-status__services li:nth-last-child(-n + 2) { border-bottom: 0; }
.fss-status__services li:last-child { border-right: 0; }

.fss-status__badge {
    flex: 0 0 auto;
    padding: 0.2rem 0.55rem;
    border-radius: 999px;
    background: #ddf4ff;
    color: var(--fss-gray);
    font-size: 0.78rem;
    line-height: 1.5;
}

.fss-status__badge--operational { background: #dafbe1; color: var(--fss-green); }
.fss-status__badge--under_maintenance { background: #fff8c5; color: var(--fss-yellow); }
.fss-status__badge--degraded_performance { background: #fff1e5; color: var(--fss-orange); }
.fss-status__badge--partial_outage,
.fss-status__badge--major_outage { background: #ffebe9; color: var(--fss-red); }

.fss-status__notice {
    margin-bottom: 0.75rem;
    padding: 0.9rem;
    border: 1px solid var(--fss-border);
    border-radius: 10px;
}

.fss-status__notice:last-child { margin-bottom: 0; }
.fss-status__notice h4 { margin-bottom: 0.45rem; font-size: 1rem; }
.fss-status__notice p:last-child { margin-bottom: 0; }

.fss-status__notice-type {
    display: inline-block;
    margin-bottom: 0.4rem;
    color: var(--fss-orange);
    font-size: 0.8rem;
    font-weight: 700;
}

.fss-status__notice-date { font-size: 0.85rem; }

.fss-status__checked {
    margin: 1rem 0 0;
    font-size: 0.82rem;
}

.fss-status__footer {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem 1rem;
    align-items: center;
    justify-content: space-between;
    margin-top: 0.8rem;
}

.fss-status__refresh {
    padding: 0.5rem 0.85rem;
    border: 1px solid var(--fss-purple);
    border-radius: 8px;
    background: var(--fss-surface);
    color: var(--fss-purple);
    cursor: pointer;
    font: inherit;
    font-size: 0.85rem;
}

.fss-status__refresh:hover { background: #f1edff; }
.fss-status__refresh:focus-visible { outline: 3px solid rgba(9, 105, 218, 0.35); outline-offset: 2px; }
.fss-status__refresh:disabled { cursor: wait; opacity: 0.65; }
.fss-status__footer a { font-size: 0.85rem; }

@media (max-width: 640px) {
    .fss-status__services ul { grid-template-columns: 1fr; }
    .fss-status__services li,
    .fss-status__services li:nth-child(odd),
    .fss-status__services li:nth-last-child(-n + 2) { border-right: 0; border-bottom: 1px solid var(--fss-border); }
    .fss-status__services li:last-child { border-bottom: 0; }
}