* { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; background: #111; color: #eee; }
header { padding: 1rem 1.5rem; background: #1a1a1a; border-bottom: 1px solid #333; display: flex; align-items: center; gap: 1.5rem; }
header h1 { font-size: 1.1rem; font-weight: 600; color: #7aa6ff; }
nav { display: flex; gap: 0.5rem; }
nav button { background: #222; color: #ccc; border: 1px solid #333; padding: 0.4rem 0.9rem; cursor: pointer; border-radius: 4px; font-size: 0.85rem; }
nav button:hover, nav button.active { background: #2a3a5a; color: #fff; border-color: #4a6aa0; }
#auth input { background: #222; color: #ccc; border: 1px solid #333; padding: 0.4rem 0.6rem; border-radius: 4px; font-size: 0.85rem; width: 260px; }
main { padding: 1.5rem; }
section { background: #1a1a1a; border: 1px solid #2a2a2a; border-radius: 6px; padding: 1rem; }
pre { font-family: "SF Mono", Menlo, monospace; font-size: 0.8rem; white-space: pre-wrap; color: #b8d4b8; }
.error { color: #ff7a7a; }
table { width: 100%; border-collapse: collapse; font-size: 0.85rem; }
th, td { padding: 0.5rem 0.75rem; text-align: left; border-bottom: 1px solid #2a2a2a; }
th { color: #7aa6ff; font-weight: 600; }
td.cat-read        { color: #8fb8ff; }
td.cat-mutation    { color: #ffd97a; }
td.cat-destructive { color: #ff9a7a; }
td.cat-admin       { color: #ff7ab8; }
