.monitor-hero{max-width:920px;padding:34px 0 40px}
.monitor-hero h1{margin:0;font-size:clamp(2.4rem,5.5vw,4rem);line-height:1.05;letter-spacing:-.05em}
.monitor-hero .lede{margin:22px 0 0;color:var(--ink);font-size:clamp(1.2rem,2.4vw,1.7rem);font-weight:760}
.scan-bar{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;margin-top:26px;padding:16px 20px;border:1px solid var(--line);border-radius:16px;background:var(--card)}
.scan-bar strong{display:block}
.scan-bar small{display:block;color:var(--muted);font-size:.86rem}
.refresh-note{margin:8px 0 0;color:var(--muted);font-size:.86rem;min-height:1.2em}
.status-strip{display:grid;grid-template-columns:repeat(6,1fr);gap:1px;margin:0 0 40px;background:var(--line);border:1px solid var(--line);border-radius:20px;overflow:hidden}
.status-cell{display:flex;flex-direction:column;gap:4px;padding:18px;background:var(--card)}
.status-cell strong{font-size:.95rem}
.status-cell small{color:var(--muted);font-size:.84rem}
.status-cell .dot{width:10px;height:10px;border-radius:50%;background:var(--muted)}
.status-cell.ok .dot{background:var(--green)}
.status-cell.warn .dot{background:var(--amber)}
.status-cell.bad .dot{background:var(--red)}
/* This project's own services are shown for completeness, not as the subject.
   Recessing them keeps the official ecosystem the thing the eye lands on. */
.monitor-table tr.own,.trust-table tr.own{background:#eef1ee}
.monitor-table tr.own td,.trust-table tr.own td{color:var(--muted)}
.monitor-table tr.own td strong{font-weight:600}
.own-tag{display:inline-block;margin-left:6px;padding:1px 7px;border-radius:999px;background:#e2e6e2;color:var(--muted);font-size:.72rem;font-weight:700;vertical-align:middle}
.block-heading{max-width:760px;margin:0 0 22px}
.block-heading h2{margin:0;font-size:clamp(1.8rem,4vw,2.8rem);line-height:1.15;letter-spacing:-.03em}
.block-heading>p:last-child{margin:10px 0 0;color:var(--muted)}
.official-block{margin-bottom:64px}
/* The project's own services live in their own recessed block, so the official
   ecosystem is never read through them. */
.own-block{margin-bottom:64px;padding:clamp(22px,4vw,36px);border:1px solid var(--line);border-radius:26px;background:#eef1ee}
.own-block .block-heading h2{font-size:clamp(1.4rem,3vw,2rem)}
.own-block .panel{background:var(--card);border-color:#dfe4df}
.own-block .status-strip{margin-bottom:24px}
.own-strip{grid-template-columns:repeat(3,1fr)}
/* A production register for an internal test card is still a production
   register; it is just not a citizen's credential, so it recedes. */
.monitor-table tr.test-card{background:#f7f8f7}
.monitor-table tr.test-card td{color:var(--muted)}
.panel{margin:0 0 16px;padding:clamp(20px,4vw,32px);background:var(--card);border:1px solid var(--line);border-radius:22px}
.panel>summary{cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;font-size:1.25rem;font-weight:800}
.panel>summary::-webkit-details-marker{display:none}
.panel>summary::after{content:"展開 ▾";color:var(--muted);font-size:.85rem;font-weight:600;white-space:nowrap}
.panel[open]>summary::after{content:"收合 ▴"}
.panel[open]>summary{margin-bottom:16px;padding-bottom:14px;border-bottom:1px solid var(--line)}
.panel-note{margin:0 0 16px;color:var(--muted);font-size:.92rem;line-height:1.7}
.panel-note code{background:#f0f4f1;padding:1px 5px;border-radius:5px}
.table-wrap{overflow-x:auto}
.monitor-table{width:100%;border-collapse:collapse;font-size:.92rem}
.monitor-table th,.monitor-table td{text-align:left;padding:11px 8px;border-bottom:1px solid var(--line);vertical-align:middle}
.monitor-table th{color:var(--muted);font-weight:600;white-space:nowrap}
.monitor-table td small{display:block;color:var(--muted)}
.loading{color:var(--muted);text-align:center;padding:24px}
.pill{display:inline-flex;align-items:center;gap:6px;padding:3px 10px;border-radius:999px;font-size:.8rem;font-weight:800;white-space:nowrap}
.pill.ok{background:var(--green-2);color:var(--green)}
.pill.bad{background:#fae2e2;color:var(--red)}
.pill.warn{background:#fff0d6;color:#8b5700}
.pill.mute{background:#eef1ee;color:var(--muted)}
.spark{display:block;width:120px;height:26px}
.spark rect{fill:var(--green)}
.spark rect.bad{fill:var(--red)}
.e2e-body{display:grid;gap:14px}
.e2e-steps{display:flex;flex-wrap:wrap;gap:8px}
.e2e-step{padding:6px 12px;border:1px solid var(--line);border-radius:12px;font-size:.86rem}
.e2e-step b{font-weight:800}
.count-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px;margin-bottom:16px}
.count-grid div{padding:14px 16px;border:1px solid var(--line);border-radius:14px}
.count-grid strong{display:block;font-size:1.6rem;line-height:1.2}
.count-grid small{color:var(--muted)}
.problem-list{margin:0;padding:0;list-style:none;display:grid;gap:8px}
.problem-list li{padding:12px 14px;border:1px solid #d7b66e;border-radius:12px;background:#fff8e9}
.problem-list code{font:12px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;overflow-wrap:anywhere;display:block;margin-top:4px;color:var(--muted)}
.timeline-section{margin-top:80px}
.timeline{display:grid;gap:2px;background:var(--line);border:1px solid var(--line);border-radius:18px;overflow:hidden}
.timeline .row{display:grid;grid-template-columns:170px 1fr;gap:16px;padding:14px 18px;background:var(--card)}
.timeline time{color:var(--muted);font-size:.86rem;white-space:nowrap}
.timeline strong{font-weight:700}
.timeline small{display:block;color:var(--muted);margin-top:3px;overflow-wrap:anywhere}
.timeline .empty{padding:28px;text-align:center;color:var(--muted);background:var(--card)}
.feed-links{margin:16px 0 0;color:var(--muted);font-size:.9rem}
.boundaries{margin-top:70px;padding:clamp(22px,4vw,34px);border:1px solid #d7b66e;border-radius:20px;background:#fff8e9}
.boundaries h2{margin:0 0 12px;font-size:1.3rem}
.boundaries ul{margin:0;padding-left:20px;color:#654f24;line-height:1.8}
@media(max-width:900px){.status-strip{grid-template-columns:repeat(3,1fr)}}
@media(max-width:640px){.status-strip{grid-template-columns:repeat(2,1fr)}.timeline .row{grid-template-columns:1fr;gap:4px}}
@media(prefers-color-scheme:dark){
  .panel-note code{background:#1b2b23}
  .problem-list li,.boundaries{background:#2b2418;border-color:#6b5a33}
  .boundaries ul{color:#e7c98f}
  .pill.bad{background:#3a1f1f}
  .pill.warn{background:#2b2418;color:#e7c98f}
  .pill.mute{background:#1b2b23}
  .monitor-table tr.own,.trust-table tr.own{background:#161d19}
  .own-tag{background:#243029}
  .monitor-table tr.test-card{background:#12171a}
  .own-block{background:#101713;border-color:#243029}
  .own-block .panel{border-color:#243029}
}