:root {
  color-scheme: light dark;
  --bg: #f7f7f5; --panel: #fff; --text: #181817; --muted: #666;
  --border: #d8d8d2; --accent: #14532d; --danger: #991b1b; --notice: #ecfdf5;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
}
@media (prefers-color-scheme: dark) { :root { --bg:#111; --panel:#191919; --text:#eee; --muted:#aaa; --border:#3a3a3a; --accent:#86efac; --danger:#fca5a5; --notice:#132a1d; } }
* { box-sizing: border-box; }
body { margin: 0; min-width: 280px; background: var(--bg); color: var(--text); font-size: 14px; line-height: 1.5; }
a { color: inherit; text-underline-offset: 3px; }
.site-header { min-height: 64px; padding: 10px max(16px, calc((100% - 1160px)/2)); border-bottom: 1px solid var(--border); display:flex; gap:16px; align-items:center; justify-content:space-between; background:var(--panel); }
.brand { font-weight: 700; text-decoration: none; white-space: nowrap; }
.site-nav { display:flex; gap:18px; align-items:center; }
.login { display:flex; gap:8px; align-items:center; }
main { width: min(1160px, calc(100% - 32px)); margin: 28px auto 64px; }
footer { width:min(1160px, calc(100% - 32px)); margin:0 auto; padding:24px 0; color:var(--muted); border-top:1px solid var(--border); }
h1,h2,h3,p { margin-top:0; } h1 { margin-bottom:0; font-size:clamp(22px, 4vw, 32px); overflow-wrap:anywhere; } h2 { font-size:17px; } h3 { font-size:14px; }
.heading { display:flex; align-items:end; justify-content:space-between; gap:16px; margin-bottom:20px; }
.eyebrow { margin-bottom:3px; color:var(--muted); font-size:12px; text-transform:uppercase; letter-spacing:.08em; }
.count,.muted,.empty,.crumb { color:var(--muted); }.count { white-space:nowrap; }.crumb { margin-bottom:18px; overflow-wrap:anywhere; }
.panel { margin:0 0 18px; padding:18px; border:1px solid var(--border); border-radius:8px; background:var(--panel); }
details > summary { cursor:pointer; font-weight:700; font-size:16px; } details[open] > summary { margin-bottom:18px; }
.form-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; align-items:end; }
.stack { display:grid; gap:12px; }.two-column { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }.two-column .panel { margin:0; }
label { display:grid; gap:5px; color:var(--muted); } input,select,button { min-height:42px; border:1px solid var(--border); border-radius:5px; background:var(--bg); color:var(--text); font:inherit; padding:8px 10px; }
button { width:max-content; cursor:pointer; background:var(--text); color:var(--bg); border-color:var(--text); font-weight:700; }.quiet { background:transparent; color:var(--text); border-color:var(--border); }.danger-button { background:var(--danger); border-color:var(--danger); color:#fff; }
.actions { align-self:end; }.check { display:flex; grid-template-columns:auto 1fr; align-items:center; color:var(--text); }.check input { min-height:auto; }
.table-wrap { overflow-x:auto; } table { width:100%; border-collapse:collapse; white-space:nowrap; } th,td { padding:10px 12px; border-bottom:1px solid var(--border); text-align:left; } th { color:var(--muted); font-weight:400; } tbody tr:last-child td { border-bottom:0; }
.cards { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }.cluster-card { padding:14px; border:1px solid var(--border); border-radius:5px; }.cluster-card p:last-child { margin-bottom:0; }
.extension-filter { display:flex; gap:10px; align-items:end; margin-bottom:18px; }.extension-filter label { flex:1; }.extension-filter input { width:100%; }.extension-filter a { min-height:42px; display:flex; align-items:center; }
.extension-list { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; }.extension-list code { padding:8px 10px; border:1px solid var(--border); border-radius:5px; background:var(--bg); overflow-wrap:anywhere; }
.facts { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:0; padding:0; overflow:hidden; }.facts div { padding:14px 18px; border-right:1px solid var(--border); border-bottom:1px solid var(--border); min-width:0; }.facts dt { color:var(--muted); }.facts dd { margin:4px 0 0; overflow-wrap:anywhere; }
.state { display:inline-block; padding:2px 7px; border:1px solid currentColor; border-radius:999px; font-size:12px; }.active,.succeeded { color:var(--accent); }.failed,.deleting { color:var(--danger); }.running,.provisioning,.draining { color:#a16207; }
.flash { padding:12px 14px; border:1px solid var(--border); border-radius:5px; }.notice { background:var(--notice); }.error { color:var(--danger); border-color:var(--danger); }.danger { border-color:var(--danger); }
pre { margin:0; padding:14px; overflow:auto; border-radius:5px; background:var(--bg); font:inherit; font-size:12px; }.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@media (max-width: 760px) { .site-header { align-items:flex-start; flex-direction:column; }.login { width:100%; }.login label { flex:1; }.login input { width:100%; }.form-grid,.two-column,.facts,.cards { grid-template-columns:1fr; }.extension-list { grid-template-columns:repeat(2,minmax(0,1fr)); }.facts div { border-right:0; }.heading { align-items:flex-start; }.panel { padding:15px; } main { margin-top:20px; } button { min-height:44px; } }
@media (max-width: 440px) { .extension-filter { align-items:stretch; flex-direction:column; }.extension-list { grid-template-columns:1fr; } }