:root{
    --st-up:#22c55e;
    --st-up-dim:rgba(34,197,94,.15);
    --st-down:#f87171;
    --st-down-dim:rgba(248,113,113,.18);
    --st-warn:#fbbf24;
    --st-partial:#fb923c;
    --st-line:#38bdf8;
    --st-none:#2a2a36;
}
.status-page{padding-bottom:48px}
.st-top{
    position:sticky;top:0;z-index:50;
    display:flex;align-items:center;justify-content:space-between;gap:16px;
    max-width:1080px;margin:0 auto;padding:20px 24px;
    background:rgba(5,5,8,.82);backdrop-filter:blur(16px);
    border-bottom:1px solid var(--border);
}
.st-logo{display:flex;align-items:center;gap:10px;font-weight:700;font-size:15px;color:var(--text)}
.st-tabs{display:flex;gap:4px;padding:4px;background:rgba(20,20,25,.8);border:1px solid var(--border);border-radius:var(--radius-pill)}
.st-tab{padding:8px 16px;font-size:13px;color:var(--muted);border-radius:var(--radius-pill);transition:color .15s,background .15s}
.st-tab:hover{color:var(--text)}
.st-tab.on{background:var(--card2);color:var(--text);box-shadow:0 1px 0 rgba(255,255,255,.04)}
.st-contact{
    font-size:13px;padding:8px 16px;border:1px solid var(--border2);border-radius:var(--radius-pill);
    color:var(--text);white-space:nowrap;transition:border-color .15s,background .15s
}
.st-contact:hover{border-color:rgba(59,130,246,.4);background:rgba(59,130,246,.08)}
.st-main{max-width:1080px;margin:0 auto;padding:32px 24px 24px;position:relative;z-index:1}
.st-view{display:none;animation:stFade .25s ease}
.st-view.on{display:block}
@keyframes stFade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.st-hero{text-align:center;padding:28px 0 36px}
.st-hero-icon{
    width:56px;height:56px;margin:0 auto 18px;border-radius:50%;
    display:flex;align-items:center;justify-content:center;
    background:var(--st-up-dim);color:var(--st-up);
}
.st-hero-icon--ok{background:var(--st-up-dim);color:var(--st-up)}
.st-hero-icon--down{background:var(--st-down-dim);color:var(--st-down)}
.st-hero-icon svg{width:28px;height:28px}
.st-hero h1{font-size:clamp(1.5rem,4vw,2rem);font-weight:700;letter-spacing:-.02em}
.st-hero-time{font-size:13px;color:var(--muted);margin-top:10px}
.st-card{
    background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);
    padding:24px 28px 28px;box-shadow:0 20px 50px rgba(0,0,0,.35)
}
.st-card-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px;flex-wrap:wrap;gap:10px}
.st-card-head h2{font-size:15px;font-weight:600;color:var(--muted)}
.st-legend{font-size:12px;color:var(--muted);display:flex;align-items:center;gap:8px}
.st-legend i{width:8px;height:8px;border-radius:50%;display:inline-block}
.st-legend .up{background:var(--st-up)}
.st-legend .down{background:var(--st-down)}
.st-comp{border-top:1px solid var(--border);padding:22px 0}
.st-comp:first-child{border-top:0;padding-top:4px}
.st-comp-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.st-comp-title{display:flex;align-items:center;gap:10px;font-size:16px;font-weight:600}
.st-comp-badge{
    width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0
}
.st-comp-badge--ok{background:var(--st-up-dim);color:var(--st-up)}
.st-comp-badge--down{background:var(--st-down-dim);color:var(--st-down)}
.st-comp-badge svg{width:14px;height:14px}
.st-comp-uptime{font-size:13px;color:var(--muted)}
.st-comp-uptime strong{color:var(--st-up);font-weight:600}
.st-comp-uptime strong.down{color:var(--st-down)}
.st-bars{display:flex;gap:2px;height:34px;align-items:flex-end;margin-bottom:18px}
.st-bar{
    flex:1;min-width:2px;border-radius:2px 2px 0 0;transition:opacity .15s;
    background:var(--st-none);position:relative;cursor:default
}
.st-bar.up{background:var(--st-up);opacity:.92}
.st-bar.down{background:var(--st-down);opacity:.95}
.st-bar.partial{background:linear-gradient(180deg,var(--st-partial) 0%,var(--st-up) 100%)}
.st-bar.none{background:var(--st-none);opacity:.45}
.st-bar:hover{opacity:1;filter:brightness(1.15)}
.st-chart-wrap{
    background:rgba(10,10,14,.6);border:1px solid var(--border);border-radius:12px;padding:12px 14px 8px
}
.st-chart-label{font-size:11px;color:var(--muted);margin-bottom:6px}
.st-chart{width:100%;height:120px;display:block}
.st-chart-axis{display:flex;justify-content:space-between;font-size:10px;color:var(--muted2);margin-top:6px;padding:0 2px}
.st-page-head{margin-bottom:24px}
.st-page-head h1{font-size:clamp(1.6rem,4vw,2.1rem);font-weight:700;letter-spacing:-.02em;margin-bottom:14px}
.st-month-nav{font-size:13px;color:var(--muted);display:flex;align-items:center;gap:10px}
.st-month-list{display:flex;flex-direction:column;gap:16px}
.st-month-card{
    background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);
    padding:22px 26px;min-height:120px
}
.st-month-card h3{font-size:15px;font-weight:600;margin-bottom:16px;color:var(--text)}
.st-empty{display:flex;align-items:center;justify-content:center;gap:8px;padding:28px 0;color:var(--muted);font-size:14px}
.st-empty svg{width:18px;height:18px;opacity:.6}
.st-incident{
    padding:14px 0;border-top:1px solid var(--border);display:grid;gap:6px
}
.st-incident:first-of-type{border-top:0;padding-top:0}
.st-incident h4{font-size:14px;font-weight:600}
.st-incident p{font-size:13px;color:var(--muted);line-height:1.55}
.st-incident-meta{font-size:12px;color:var(--muted2)}
.st-tag{
    display:inline-block;font-size:11px;padding:2px 8px;border-radius:6px;
    background:rgba(248,113,113,.12);color:var(--st-down);margin-right:6px
}
.st-tag.resolved{background:rgba(34,197,94,.12);color:var(--st-up)}
.st-maint-item{padding:12px 0;border-top:1px solid var(--border)}
.st-maint-item:first-child{border-top:0;padding-top:0}
.st-powered{
    text-align:center;font-size:12px;color:var(--muted2);padding:20px 24px 8px;position:relative;z-index:1
}
.st-powered a{color:var(--muted);margin:0 4px}
.st-powered a:hover{color:var(--blue)}
.status-page .site-foot{margin-top:8px}
@media(max-width:860px){
    .st-top{flex-wrap:wrap;justify-content:center}
    .st-tabs{order:3;width:100%;justify-content:center;overflow-x:auto}
    .st-contact{display:none}
    .st-card{padding:18px 16px 20px}
    .st-bars{height:28px}
}
