/* Struktur nach status.claude.com; Gestaltung mit bestehenden Kuono-Tokens. */
@font-face { font-family: 'Sora Variable'; font-style: normal; font-weight: 100 800; font-display: swap; src: url('/sora.woff2') format('woff2'); }
* { box-sizing: border-box; }
body { margin: 0; background: var(--ku-bg); color: var(--ku-text); font: var(--ku-fw-body) var(--ku-fs-body)/var(--ku-lh-body) var(--ku-font); }
a { color: inherit; text-underline-offset: 4px; }
:focus-visible { outline: var(--ku-focus); outline-offset: var(--ku-focus-offset); border-radius: 0; }
h1 { font-size: var(--ku-fs-page); line-height: var(--ku-lh-page); font-weight: var(--ku-fw-page); letter-spacing: var(--ku-ls-page); margin: 0 0 var(--ku-sp-3); }
h2 { font-size: var(--ku-fs-sect); line-height: var(--ku-lh-sect); font-weight: var(--ku-fw-sect); margin: 0; }
h3 { font-size: var(--ku-fs-row); line-height: var(--ku-lh-row); font-weight: var(--ku-fw-row); margin: 0; }
p { margin: var(--ku-sp-2) 0; }
.ku-status-header { min-height: var(--ku-h-header); padding: var(--ku-sp-3) max(var(--ku-sp-4), env(safe-area-inset-right)) var(--ku-sp-3) max(var(--ku-sp-4), env(safe-area-inset-left)); border-bottom: 1px solid var(--ku-line); display: flex; align-items: center; gap: var(--ku-sp-4); flex-wrap: wrap; max-width: 900px; margin: var(--ku-sp-6) auto 0; border: 0; }
.ku-status-brand { font-size: var(--ku-fs-metric); font-weight: 600; text-decoration: none; letter-spacing: var(--ku-ls-metric); }
.ku-status-header .ku-btn { margin-left: auto; text-decoration: none; }
.ku-status-header a { min-height: var(--ku-h-field); display: inline-flex; align-items: center; }
.ku-status-main { max-width: 900px; margin: auto; padding: var(--ku-sp-7) max(var(--ku-sp-4), env(safe-area-inset-left)) var(--ku-sp-6); padding-top: var(--ku-sp-6); }
#checked, .ku-status-method, .ku-status-footer, .ku-status-description, .ku-status-history-note { color: var(--ku-text-muted); }
.ku-status-summary { margin: var(--ku-sp-4) 0 var(--ku-sp-7); padding-bottom: var(--ku-sp-5); border-bottom: 1px solid var(--ku-edge); display: flex; gap: var(--ku-sp-3); align-items: center; margin-top: 0; padding: var(--ku-sp-4); border: 0; background: var(--ku-bg-subtle); }
.ku-status-dot { display: inline-block; flex: 0 0 var(--ku-sp-2); width: var(--ku-sp-2); height: var(--ku-sp-2); border-radius: var(--ku-r-full); background: var(--ku-neutral-dot); }
.ku-status-dot[data-status="up"], .ku-status-bar[data-status="up"] { background: var(--ku-ok); }
.ku-status-dot[data-status="down"], .ku-status-bar[data-status="down"] { background: var(--ku-bad); }
.ku-status-sectionhead, .ku-status-servicehead { display: flex; align-items: baseline; justify-content: space-between; gap: var(--ku-sp-3); flex-wrap: wrap; }
.ku-status-service { padding-block: var(--ku-sp-4); border-bottom: 1px solid var(--ku-line); padding: var(--ku-sp-4); }
.ku-status-state { display: inline-flex; align-items: center; gap: var(--ku-sp-2); font-weight: var(--ku-fw-ui); font-size: var(--ku-fs-meta); }
.ku-status-bars { display: grid; grid-template-columns: repeat(90, minmax(0, 1fr)); gap: 2px; margin-top: var(--ku-sp-2); }
.ku-status-bar { height: var(--ku-h-btn-sm); background: var(--ku-line); }
.ku-status-history-note { display: flex; justify-content: space-between; gap: var(--ku-sp-3); flex-wrap: wrap; margin-top: var(--ku-sp-2); font-size: var(--ku-fs-meta); }
.ku-status-detail { display: flex; gap: var(--ku-sp-3); align-items: center; flex-wrap: wrap; margin-top: var(--ku-sp-3); }
.ku-status-detail select { font: inherit; background: var(--ku-bg); color: var(--ku-text); border: 1px solid var(--ku-border); padding: var(--ku-sp-2); min-height: var(--ku-h-field); max-width: 100%; border-radius: 0; }
.ku-status-service details { margin-top: var(--ku-sp-1); }
summary { cursor: pointer; min-height: var(--ku-h-field); padding-block: var(--ku-sp-3); }
.ku-status-incidents { margin-block: var(--ku-sp-6); }
.ku-status-incidents ol { padding: 0; list-style: none; }
.ku-status-incidents li { padding: var(--ku-sp-4) 0; border-bottom: 1px solid var(--ku-line); border: 0; }
.ku-status-method { border-top: 1px solid var(--ku-line); padding-top: var(--ku-sp-3); }
.ku-status-method summary { color: var(--ku-text); }
.ku-status-footer { border-top: 1px solid var(--ku-line); padding: var(--ku-sp-4) max(var(--ku-sp-4), env(safe-area-inset-right)) max(var(--ku-sp-4), env(safe-area-inset-bottom)) max(var(--ku-sp-4), env(safe-area-inset-left)); display: flex; gap: var(--ku-sp-3); justify-content: space-between; flex-wrap: wrap; font-size: var(--ku-fs-meta); max-width: 900px; margin: auto; }
.ku-status-footer nav { display: flex; gap: var(--ku-sp-4); }
.ku-status-footer a { min-height: var(--ku-h-field); display: inline-flex; align-items: center; }

.ku-status-brand span { font-weight: var(--ku-fw-body); margin-left: var(--ku-sp-2); }
.ku-status-subscribe { margin-left: auto; position: relative; }
.ku-status-subscribe summary { min-height: var(--ku-h-field); list-style: none; }
.ku-status-subscribe summary::-webkit-details-marker { display: none; }
.ku-status-subscribe > div { position: absolute; top: 100%; right: 0; z-index: 5; width: min(320px, calc(100vw - 48px)); padding: var(--ku-sp-4); background: var(--ku-bg); border: 1px solid var(--ku-border); box-shadow: var(--ku-shadow-menu); }
.ku-status-summary[data-status="up"] { background: var(--ku-ok); color: var(--ku-bg); }
.ku-status-summary[data-status="down"] { background: var(--ku-bad); color: var(--ku-bg); }
.ku-status-summary[data-status="up"] #checked, .ku-status-summary[data-status="down"] #checked { color: inherit; }
.ku-status-summary .ku-status-dot { display: none; }
.ku-status-summary h1 { font-size: var(--ku-fs-sect); line-height: var(--ku-lh-sect); font-weight: var(--ku-fw-sect); letter-spacing: var(--ku-ls-sect); }
.ku-status-summary #checked { font-size: var(--ku-fs-meta); margin-bottom: 0; }
.ku-status-sectionhead { margin-bottom: var(--ku-sp-2); }
.ku-status-sectionhead h2 { font-size: var(--ku-fs-body); }
.ku-status-sectionhead > span { font-size: var(--ku-fs-meta); }
#services { border: 1px solid var(--ku-line); }
.ku-status-service:last-child { border-bottom: 0; }
.ku-status-service h3 { font-size: var(--ku-fs-body); font-weight: var(--ku-fw-ui); }
.ku-status-state[data-status="up"] { color: var(--ku-ok); }
.ku-status-state[data-status="down"] { color: var(--ku-bad); }
.ku-status-service summary { font-size: var(--ku-fs-meta); padding-bottom: 0; }
.ku-status-legend { display: flex; justify-content: flex-end; gap: var(--ku-sp-3); flex-wrap: wrap; margin-top: var(--ku-sp-3); font-size: var(--ku-fs-meta); color: var(--ku-text-muted); }
.ku-status-legend span { display: inline-flex; gap: var(--ku-sp-1); align-items: center; }
.ku-status-incidents li h3 { padding-bottom: var(--ku-sp-2); border-bottom: 1px solid var(--ku-line); }
.ku-status-incidents h4 { font-weight: var(--ku-fw-ui); font-size: var(--ku-fs-body); }
@media (max-width: 600px) { .ku-status-header { margin-top: var(--ku-sp-3); gap: var(--ku-sp-3); } .ku-status-header .ku-btn { padding-inline: var(--ku-sp-2); } .ku-status-bars { gap: 1px; } .ku-status-main { padding-top: var(--ku-sp-4); } .ku-status-brand { font-size: var(--ku-fs-sect); } .ku-status-service { padding: var(--ku-sp-3); } .ku-status-summary { margin-bottom: var(--ku-sp-5); } .ku-status-history-note { font-size: var(--ku-fs-meta); } }