@import url("legal.css");
.status-surface { min-height: calc(100vh - 5.5rem); margin: 0 2.25vw 2.25vw; overflow: hidden; border-radius: .625rem; background: #fff; box-shadow: 0 8px 20px rgb(15 23 42 / .025); }
.status-main { max-width: 54rem; margin: 0 auto; padding: clamp(3rem, 7vw, 5.5rem) 6vw 4rem; }.status-intro { text-align: center; }.status-kicker { display: inline-flex; align-items: center; gap: .55rem; margin: 0; color: #14835f; font-size: .78rem; font-weight: 700; letter-spacing: .05em; }.status-dot { width: .58rem; height: .58rem; border-radius: 50%; background: #00b578; box-shadow: 0 0 0 .33rem rgb(0 181 120 / .12), 0 0 .9rem rgb(0 181 120 / .7); }.status-intro h1 { margin: 1.25rem 0 .9rem; color: #252a3a; font-size: clamp(2.7rem, 7vw, 5rem); line-height: .95; letter-spacing: -.065em; }.status-intro > p { max-width: 34rem; margin: 0 auto; color: #667085; font-size: 1rem; line-height: 1.6; }.refresh-row { display: flex; align-items: center; justify-content: center; gap: .75rem; margin-top: 1.45rem; color: #7b8494; font-size: .76rem; }.refresh-button { display: inline-flex; align-items: center; gap: .35rem; padding: 0; border: 0; background: transparent; color: #245bff; font: inherit; font-weight: 700; cursor: pointer; }.refresh-button svg { width: .9rem; }.refresh-button.is-refreshing svg { animation: refresh-spin .65s linear infinite; }@keyframes refresh-spin { to { transform: rotate(360deg); } }
.uptime-card { display: grid; grid-template-columns: 1fr auto; gap: 1rem; align-items: center; margin-top: clamp(2.5rem, 5vw, 4rem); padding: 1.25rem 1.4rem; border: 1px solid #dcefe8; border-radius: 1rem; background: linear-gradient(135deg, #f8fffc, #f0fff8); }.uptime-card p { margin: 0; color: #667085; font-size: .8rem; }.uptime-card strong { display: block; margin-top: .2rem; color: #15805e; font-size: 1.1rem; letter-spacing: -.025em; }.uptime-card > span { color: #15805e; font-size: .78rem; font-weight: 700; }
.services { display: grid; gap: .65rem; margin-top: 1.25rem; }.service { overflow: hidden; border: 1px solid #e8ebf1; border-radius: .9rem; background: #fff; transition: box-shadow .2s ease, border-color .2s ease; }.service:hover, .service.is-open { border-color: #dce5f7; box-shadow: 0 .7rem 1.6rem rgb(15 23 42 / .05); }.service-trigger { display: grid; grid-template-columns: auto 1fr auto auto; gap: .8rem; align-items: center; width: 100%; min-height: 4.15rem; padding: .9rem 1.05rem; border: 0; background: transparent; color: #252a3a; font: inherit; text-align: left; cursor: pointer; }.service-trigger:focus-visible { outline: 3px solid #a9bbff; outline-offset: -3px; }.service-indicator { width: .65rem; height: .65rem; border-radius: 50%; background: #00b578; box-shadow: 0 0 .6rem rgb(0 181 120 / .55); }.service-name { font-size: .9rem; font-weight: 700; }.service-state { color: #14835f; font-size: .75rem; font-weight: 650; }.service-chevron { width: 1rem; color: #7b8494; transition: transform .2s ease; }.service.is-open .service-chevron { transform: rotate(180deg); }.service-detail { display: grid; grid-template-rows: 0fr; border-top: 1px solid transparent; transition: grid-template-rows .25s ease, border-color .25s ease; }.service-detail > div { overflow: hidden; }.service-detail p { margin: 0; padding: 0 1.05rem 1rem 2.5rem; color: #697386; font-size: .8rem; line-height: 1.5; }.service.is-open .service-detail { grid-template-rows: 1fr; border-top-color: #edf0f4; }
.status-bottom { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem; margin-top: 2rem; }.status-note, .subscribe-card { padding: 1.15rem; border-radius: .9rem; }.status-note { background: #f5f7fb; }.status-note p { margin: 0; color: #697386; font-size: .78rem; line-height: 1.55; }.status-note strong { display: block; margin-bottom: .25rem; color: #343b4d; font-size: .84rem; }.subscribe-card { background: #252a3a; color: #fff; }.subscribe-card h2 { margin: 0; font-size: .95rem; letter-spacing: -.02em; }.subscribe-card p { margin: .35rem 0 .8rem; color: rgb(255 255 255 / .66); font-size: .74rem; line-height: 1.4; }.subscribe-form { display: flex; gap: .4rem; }.subscribe-form input { width: 100%; min-width: 0; height: 2.25rem; padding: 0 .65rem; border: 1px solid rgb(255 255 255 / .18); border-radius: .48rem; background: rgb(255 255 255 / .1); color: #fff; font: inherit; font-size: .72rem; }.subscribe-form input::placeholder { color: rgb(255 255 255 / .5); }.subscribe-form button { height: 2.25rem; padding: 0 .68rem; border: 0; border-radius: .48rem; background: #fff; color: #252a3a; font: inherit; font-size: .72rem; font-weight: 750; cursor: pointer; }.subscribe-message { min-height: 1em; margin: .55rem 0 0; color: #9cf0d2; font-size: .68rem; }
@media (max-width: 700px) { .status-surface { margin: 0 .75rem .75rem; }.status-main { padding-inline: 1.4rem; }.uptime-card { grid-template-columns: 1fr; }.status-bottom { grid-template-columns: 1fr; }.service-trigger { grid-template-columns: auto 1fr auto; }.service-state { display: none; } }

/* Status overview: let the live state lead, with utility controls kept unobtrusive. */
.status-surface { position: relative; }
.status-main { padding-top: clamp(4.5rem, 8vw, 6.5rem); }
.status-kicker, .uptime-card { display: none; }
.status-intro h1 { margin-top: 0; }
.status-intro h1::before { content: ""; display: inline-block; width: .58rem; height: .58rem; margin-right: .3em; border-radius: 50%; background: #00b578; box-shadow: 0 0 0 .33rem rgb(0 181 120 / .12), 0 0 .9rem rgb(0 181 120 / .7); vertical-align: .13em; }
.services { margin-top: clamp(2.5rem, 5vw, 4rem); }
.refresh-row { position: absolute; top: 1.15rem; right: 1.35rem; justify-content: flex-end; margin-top: 0; }
@media (max-width: 700px) { .status-main { padding-top: 4.3rem; }.refresh-row { top: .9rem; right: 1rem; gap: .5rem; }.refresh-button { font-size: .72rem; } }

.subscribe-form button { position: relative; width: 2.25rem; padding: 0; color: transparent; font-size: 0; }
.subscribe-form button::after { content: ""; position: absolute; top: .63rem; left: .67rem; width: .76rem; height: .72rem; border: 2px solid #252a3a; border-bottom: 0; border-radius: .48rem .48rem .16rem .16rem; box-shadow: 0 .52rem 0 -.22rem #252a3a; }
