* { box-sizing: border-box; }
body {
  margin: 0; font: 15px/1.5 system-ui, sans-serif;
  color: #1c2733; background: #f6f7f9;
}
header {
  display: flex; align-items: center; gap: 1.5rem;
  background: #243447; color: #fff; padding: .6rem 1.2rem;
}
header .brand { color: #fff; font-weight: 700; text-decoration: none; font-size: 1.1rem; }
header nav a { color: #cfe0f5; margin-right: 1rem; text-decoration: none; }
header nav a:hover { color: #fff; }
main { max-width: 72rem; margin: 1.2rem auto; padding: 0 1.2rem; }
footer { max-width: 72rem; margin: 2rem auto; padding: 0 1.2rem 2rem; color: #7a8899; font-size: .85rem; }
a { color: #1d5fa8; }
h1 { font-size: 1.35rem; }
h1.path { word-break: break-all; }
table { border-collapse: collapse; width: 100%; background: #fff; }
th, td { text-align: left; padding: .35rem .6rem; border-bottom: 1px solid #e3e7ec; }
th { background: #eef1f5; font-weight: 600; }
td.num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.crumbs { margin-bottom: .8rem; color: #55606c; word-break: break-all; }
.hint { color: #55606c; font-size: .9rem; }
.warn { background: #fff3e0; border: 1px solid #ffce8a; padding: .5rem .8rem; border-radius: 4px; }
.btn {
  display: inline-block; background: #1d5fa8; color: #fff; text-decoration: none;
  padding: .3rem .8rem; border-radius: 4px; font-size: .9rem;
}
.btn:hover { background: #174c87; }
.btn.secondary { background: #5b6b7d; }
.btn.secondary:hover { background: #46545f; }
.dl { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin-bottom: 1rem; }
.dl label { color: #55606c; font-size: .9rem; }
.dl select, .dl button { font: inherit; padding: .25rem .4rem; }
.dl button {
  background: #1d5fa8; color: #fff; border: 0; border-radius: 4px;
  padding: .3rem .9rem; cursor: pointer;
}
.dl button:hover { background: #174c87; }
td.real { font-family: monospace; font-size: .85rem; word-break: break-all; }
.st { font-size: .75rem; padding: .1rem .45rem; border-radius: 3px; white-space: nowrap; }
.st-present   { background: #e3f3e6; color: #1d6b2c; }
.st-symbolic  { background: #eef1f5; color: #55606c; }
.st-container { background: #eef1f5; color: #55606c; }
.st-absent    { background: #fff3e0; color: #8a5a12; }
.ro { font-size: .75rem; color: #8a5a12; border: 1px solid #ffce8a; padding: 0 .3rem; border-radius: 3px; }
.search { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1rem; }
.search input, .search select, .search button { padding: .35rem .5rem; font: inherit; }
details { margin: .8rem 0; }
table.meta { width: auto; }
table.meta td:first-child { color: #55606c; font-family: monospace; font-size: .85rem; }
pre.doc {
  background: #fff; border: 1px solid #e3e7ec; padding: 1rem;
  white-space: pre-wrap; word-break: break-word; font: 14px/1.6 Georgia, serif;
}