/* The hub's start page. */
main { max-width: 900px; margin: 0 auto; padding: 48px 24px 64px; }
header { margin-bottom: 32px; }
h1 { display: flex; align-items: center; gap: 14px; margin: 0; font-size: 32px; font-weight: 600; color: var(--accent); }
h1 .mark { height: 1.25em; }
header p { margin: 4px 0 0; color: var(--muted); }
h2 { margin: 28px 0 12px; padding-bottom: 4px; font-size: 19px; font-weight: 600; border-bottom: 1px solid var(--line); }

/* One card per wiki. */
.wikis { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; }
.wikis a { display: block; height: 100%; overflow: hidden; background: var(--panel); border: 1px solid var(--line); border-radius: 6px; text-decoration: none; }
.wikis a:hover { border-color: var(--accent); }
.wikis img { display: block; width: 100%; aspect-ratio: 460 / 215; object-fit: cover; border-bottom: 1px solid var(--line); }
.wikis strong { display: block; padding: 14px 16px 0; font-size: 18px; font-weight: 600; }
.wikis span { display: block; padding: 6px 16px 16px; color: var(--muted); }
#account { justify-content: flex-end; min-height: 32px; margin-bottom: 16px; }
.wikis strong small { margin-left: 8px; padding: 1px 6px; font-size: 11px; font-weight: 600; color: var(--muted); border: 1px solid var(--line); border-radius: 4px; vertical-align: middle; }

/* The admin panel (admin.js). */
#admin { margin-top: 48px; }
#admin h3 { margin: 16px 0 4px; font-size: 15px; font-weight: 600; }
#admin > p { margin: 0 0 12px; color: var(--muted); }
#admin-wikis { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
#admin-wikis li { padding: 12px 16px; background: var(--panel); border: 1px solid var(--line); border-radius: 6px; }
#admin-wikis p { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; margin: 0 0 8px; font-weight: 600; }
#admin-wikis small { color: var(--muted); font-weight: 400; }
#admin .parts { display: grid; gap: 8px; }
#admin .tools { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 20px; margin-left: 9px; padding-left: 16px; border-left: 2px solid var(--line); }
#admin .tools.waiting label { opacity: 0.55; }
#admin label { display: flex; align-items: center; gap: 6px; cursor: pointer; }
#admin input { accent-color: var(--accent); }