:root { color-scheme: light; --ink:#18211c; --muted:#647068; --line:#d8ded9;
  --paper:#f6f8f6; --panel:#fff; --green:#12633c; --amber:#9b5d00; --red:#a22a2a; }
* { box-sizing:border-box; }
body { margin:0; background:var(--paper); color:var(--ink); font:14px/1.5 ui-sans-serif,system-ui,sans-serif; }
header { height:58px; background:#102119; color:#fff; display:flex; align-items:center;
  justify-content:space-between; padding:0 24px; border-bottom:3px solid #40a36b; }
header a { color:#fff; text-decoration:none; font-weight:700; font-size:16px; }
main { width:min(1180px,calc(100% - 32px)); margin:28px auto 56px; }
h1 { font-size:24px; margin:0 0 6px; letter-spacing:0; }
h2 { font-size:16px; margin:0; letter-spacing:0; }
p { margin:0; }
.sub { color:var(--muted); margin-bottom:24px; }
.error { color:var(--red); }
.panel { background:var(--panel); border:1px solid var(--line); border-radius:6px; overflow:hidden; }
table { width:100%; border-collapse:collapse; }
th,td { padding:13px 15px; text-align:left; border-bottom:1px solid var(--line); vertical-align:top; }
th { color:var(--muted); background:#f1f4f1; font-size:12px; text-transform:uppercase; }
tr:last-child td { border-bottom:0; }
td a { color:var(--green); font-weight:650; text-decoration:none; }
.status { display:inline-flex; align-items:center; gap:6px; font-weight:650; }
.dot { width:8px; height:8px; border-radius:50%; background:var(--green); }
.dot.closed { background:var(--muted); }
.dot.paused { background:var(--amber); }
.quiet { border:1px solid #789184; background:transparent; color:#fff; border-radius:4px;
  padding:7px 11px; cursor:pointer; }
.back { display:inline-block; color:var(--green); margin-bottom:14px; text-decoration:none; font-weight:650; }
.stream { border-top:1px solid var(--line); }
.event { display:grid; grid-template-columns:170px minmax(140px,220px) 1fr; gap:16px;
  padding:15px; border-bottom:1px solid var(--line); }
.event:last-child { border-bottom:0; }
.time,.route,.meta { color:var(--muted); }
.alias { font-weight:700; }
.body { margin-top:4px; white-space:pre-wrap; overflow-wrap:anywhere; }
.empty { padding:38px 20px; color:var(--muted); text-align:center; }
.login { width:min(460px,calc(100% - 32px)); margin:12vh auto; padding:26px; background:#fff;
  border:1px solid var(--line); border-radius:6px; }
@media (max-width:760px) {
  header { padding:0 16px; }
  main { width:calc(100% - 20px); margin-top:18px; }
  .panel { overflow-x:auto; }
  th,td { min-width:120px; }
  .event { grid-template-columns:1fr; gap:5px; }
}