:root{
  --bg:#0b1220; --panel:rgba(148,163,184,.08); --panel2:rgba(148,163,184,.13);
  --border:rgba(148,163,184,.20); --text:#f8fafc; --muted:#94a3b8;
  --accent:#38bdf8; --accent-dim:rgba(56,189,248,.14);
  --green:#34d399; --violet:#a78bfa; --amber:#fbbf24; --slate:#94a3b8;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{background:radial-gradient(1200px 600px at 20% -10%,#16233d 0%,var(--bg) 55%) fixed,var(--bg);
  color:var(--text);font-family:"Instrument Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  font-size:15px;line-height:1.45;padding:28px 18px 64px}
a{color:var(--accent)}
.wrap{max-width:1060px;margin:0 auto}
header.top{margin-bottom:18px}
h1{font-family:"Newsreader",Georgia,serif;font-weight:600;font-size:34px;margin:0 0 4px;letter-spacing:.2px}
.sub{color:var(--muted);font-size:14px;margin:0}
.controls{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:18px 0 6px}
.pill{border:1px solid var(--border);background:var(--panel);color:var(--text);
  border-radius:999px;padding:5px 12px;font-size:13px;cursor:pointer;font-family:inherit}
.pill[aria-pressed="true"]{background:var(--accent-dim);border-color:var(--accent);color:#e0f2fe}
.pill.off{opacity:.45}
.seg{display:inline-flex;border:1px solid var(--border);border-radius:999px;overflow:hidden}
.seg button{background:transparent;border:0;color:var(--muted);padding:5px 12px;font-size:13px;cursor:pointer;font-family:inherit}
.seg button[aria-pressed="true"]{background:var(--accent-dim);color:#e0f2fe}
.ghostbtn{background:transparent;border:1px solid var(--border);color:var(--muted);
  border-radius:999px;padding:5px 12px;font-size:13px;cursor:pointer;font-family:inherit}
.ghostbtn:hover{color:var(--text)}
.countline{color:var(--muted);font-size:12.5px;margin:8px 2px 14px}
section.cat{margin-top:22px}
section.cat h2{font-family:"Newsreader",Georgia,serif;font-size:20px;font-weight:600;margin:0 0 10px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px}
.card{background:var(--panel);border:1px solid var(--border);border-radius:14px;
  padding:14px 15px;backdrop-filter:blur(8px);display:flex;flex-direction:column;gap:6px}
.card .name{font-family:"Newsreader",Georgia,serif;font-size:18px;font-weight:600;line-height:1.25}
.path{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11.5px;color:var(--muted);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.blurb{color:#cbd5e1;font-size:13.5px;flex:1}
.cardfoot{display:flex;gap:8px;align-items:center;margin-top:4px}
.openbtn{background:var(--accent-dim);border:1px solid var(--accent);color:#e0f2fe;
  border-radius:8px;padding:4px 12px;font-size:13px;text-decoration:none}
.hidebtn{margin-left:auto;background:transparent;border:0;color:var(--muted);font-size:12.5px;cursor:pointer;font-family:inherit}
.hidebtn:hover{color:var(--text)}
.badge{font-size:10.5px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;
  border-radius:999px;padding:2px 8px;border:1px solid var(--border);color:var(--slate);white-space:nowrap}
.badge.live{color:var(--green);border-color:rgba(52,211,153,.4)}
.badge.desktop{color:var(--violet);border-color:rgba(167,139,250,.4)}
.badge.caution{color:var(--amber);border-color:rgba(251,191,36,.4)}
.cardtop{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}
.rows{display:flex;flex-direction:column;gap:6px}
.row{display:flex;gap:10px;align-items:baseline;background:var(--panel);border:1px solid var(--border);
  border-radius:10px;padding:8px 12px;cursor:pointer}
.row:hover{background:var(--panel2)}
.row .name{font-family:"Newsreader",Georgia,serif;font-size:16px;font-weight:600;white-space:nowrap}
.row .blurb{font-size:12.5px;color:var(--muted);flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.row .path{flex:none}
.is-hidden-item{opacity:.45;border-style:dashed}
.empty{color:var(--muted);font-size:13.5px;padding:10px 2px}
footer{color:var(--muted);font-size:12px;margin-top:34px}
/* sub-pages */
.page h1{font-size:28px}
.page h2{font-family:"Newsreader",Georgia,serif;font-size:20px;margin:22px 0 8px}
.page p,.page li{color:#dbe4f0;font-size:14.5px}
.page .muted{color:var(--muted)}
.panel{background:var(--panel);border:1px solid var(--border);border-radius:12px;padding:12px 14px;margin:10px 0}
.qitem{padding:7px 0;border-bottom:1px solid rgba(148,163,184,.12)}
.qitem:last-child{border-bottom:0}
.qdate{color:var(--muted);font-size:11.5px;font-family:ui-monospace,Menlo,monospace}
.qtext{white-space:pre-wrap;word-break:break-word;font-size:14px;color:#e8eef7}
.chipnav{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0}
input.search{background:var(--panel);border:1px solid var(--border);border-radius:8px;color:var(--text);
  padding:7px 11px;font-size:14px;font-family:inherit;width:min(420px,100%)}
.backlink{font-size:13px}