:root{--paper:white;--ink:#172b38;--muted:#4d626f;--line:#dce3e8;--blue:#0056a0}
*{box-sizing:border-box}body{margin:0;font:14px/1.4 system-ui,sans-serif;color:var(--ink);background:white}
header{display:flex;align-items:center;flex-wrap:wrap;gap:16px;padding:9px 16px;border-bottom:1px solid var(--line)}
h1{font-size:1.25rem;margin:0;font-weight:650}header p{margin:2px 0 0;font-size:.8rem;color:var(--muted)}nav{display:flex;align-items:center;gap:16px;margin-left:auto;font-size:.85rem}a{color:var(--blue)}
.logos{display:flex;gap:10px;align-items:center}.logos img{max-width:95px;height:28px;object-fit:contain}.logos img:nth-child(2){max-width:30px}
main{max-width:1440px;margin:auto;padding:10px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;align-items:start}.full{grid-column:1/-1}
.card{padding:10px;border:1px solid var(--line);border-radius:5px;min-width:0;background:white}.stack{display:grid;gap:10px;min-width:0}
h2,summary{font-size:.96rem;font-weight:650;margin:0 0 5px}summary{cursor:pointer}details:not([open]) summary{margin:0}.heading{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}.caption{font-size:.78rem;color:var(--muted);margin:4px 0 6px}.help{font-size:.75rem;color:var(--muted);margin:0}
.notice{margin:0;padding:7px 10px;border-left:4px solid #168837;background:#edf9ef}.stale{border-color:#b07700;background:#fff8df;color:#765200}.error{color:#ad1f28}
.plot{min-width:0;overflow:visible}.plot canvas{display:block;max-width:100%}.event-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.raw-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px 4px}
.card-top{background:white}.card-actions{display:flex;align-items:start;justify-content:space-between;gap:6px}.card-actions .rustplotlib-controls{margin:0 0 5px!important}.maximize{margin-left:auto;flex-shrink:0}.rustplotlib-controls button[aria-pressed=true]{background:#d9edf9;border-color:#0056a0}.rustplotlib-controls button{min-height:30px}.health{padding:10px;border:2px solid #a1afb9;border-radius:5px;background:#f3f5f7}.health-items{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:6px}.health-item{display:grid;align-content:start;gap:3px;border-left:4px solid #72808a;padding:5px 8px;font-size:.78rem;background:white}.health-item span{color:var(--muted)}.health[data-state=ok]{border-color:#168837}.health-item[data-state=ok]{border-color:#168837;color:#126329}.health[data-state=bad]{border-color:#cf202c;background:#fff0f0}.health-item[data-state=bad]{border-color:#cf202c;color:#a11e25}.health[data-state=warn]{border-color:#b07700;background:#fff9e6}.health-item[data-state=warn]{border-color:#b07700;color:#765200}.health-item[data-state=unknown]{border-color:#72808a;color:#52616b}
body.has-maximized{overflow:hidden}.card.maximized{position:fixed;inset:5px;z-index:20;overflow:auto;border:2px solid #0056a0;box-shadow:0 0 0 10px white;border-radius:5px}.maximized .card-top{position:sticky;top:-10px;z-index:6;padding-top:5px;padding-bottom:3px}.maximized .event-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
label,button,select{font:inherit;font-size:.8rem}select,button{color:var(--ink);background:white;border:1px solid #b4c2ca;border-radius:4px;padding:4px 7px}button{cursor:pointer}
table{border-collapse:collapse;width:100%;font-size:.8rem;margin:8px 0}td,th{text-align:left;border-bottom:1px solid var(--line);padding:5px 8px}.table-wrap{overflow:auto}.service-grid{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0}.service{padding:6px 9px;border-radius:4px;background:#e6f6e9;color:#126329;border:1px solid #a4cfb1}.service.bad{background:#ffe8e8;color:#a11e25;border-color:#e4a8ab}.ok{color:#157832}.bad{color:#ba1726}footer{font-size:.75rem;color:var(--muted)}
@media(max-width:850px){.logos{display:grid;grid-template-columns:3fr 1fr 3fr 3fr;gap:12px;width:100%;max-width:420px}.logos img{width:100%;min-width:0}main{grid-template-columns:1fr}.full{grid-column:auto}.event-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:550px){header{gap:8px}nav{margin:0}.event-grid,.maximized .event-grid{grid-template-columns:1fr}.health-items{grid-template-columns:repeat(2,minmax(0,1fr))}.card{padding:7px}main{padding:6px;gap:7px}.rustplotlib-controls span{flex-basis:100%}.card.maximized{inset:2px}.maximized .card-top{top:-7px}}
