/* Server dashboard unslop (2026-10-31, Mike asked for the full pass on every page
   inside a server). Scoped to .dashboard-root.has-guild:not(.dash-v1) so the public site, /admin
   and the server picker keep their look. Undo: drop the <link> in layout.ejs and this
   file, or run Backups/unslop-2026-10-31/RESTORE.sh. This is "V2" on /customize →
   Dashboard style; picking V1 puts .dash-v1 on the root and none of it applies.

   Rules: one accent (var(--brand)), used for the selected nav item, the primary
   number and the music label. Everything else is the theme's own neutrals. 4px grid,
   radii 6 / 10 / 16, weights 400-600, sentence case, no glows, no lifts. */

.dashboard-root.has-guild:not(.dash-v1) {
    --u-ease: cubic-bezier(.2, .8, .2, 1);
    --u-hair: color-mix(in srgb, var(--text) 8%, transparent);
    --u-step: color-mix(in srgb, var(--text) 5%, transparent);
    --u-step-2: color-mix(in srgb, var(--text) 9%, transparent);
    --u-dim: color-mix(in srgb, var(--text) 26%, transparent);
}

/* ---- Type: sentence case, no tracked labels, two weights, tabular figures ---- */
.dashboard-root.has-guild:not(.dash-v1) * { text-transform: none; }
.dashboard-root.has-guild:not(.dash-v1) :is(.tracking-wide, .tracking-wider, .tracking-widest, .side-title, .nav-section, .np-label) { letter-spacing: normal; }
.dashboard-root.has-guild:not(.dash-v1) :is(.app-main, .app-rightbar) { font-variant-numeric: tabular-nums; }
.dashboard-root.has-guild:not(.dash-v1) :is(.font-extrabold, .font-black) { font-weight: 600; }
.dashboard-root.has-guild:not(.dash-v1) .font-bold { font-weight: 500; }
.dashboard-root.has-guild:not(.dash-v1) :is(.app-main, .app-rightbar) :is(b, strong) { font-weight: 600; }
.dashboard-root.has-guild:not(.dash-v1) .app-main h1 { font-size: 32px; line-height: 40px; font-weight: 600; letter-spacing: -.02em; }
.dashboard-root.has-guild:not(.dash-v1) .app-main :is(h2, h3) { font-weight: 600; letter-spacing: -.005em; }
.dashboard-root.has-guild:not(.dash-v1) .app-main h2.text-xl { font-size: 18px; line-height: 24px; }
.dashboard-root.has-guild:not(.dash-v1) .brand-text { color: var(--text); background: none; -webkit-text-fill-color: currentColor; }

/* Heading icons carry no colour of their own. */
.dashboard-root.has-guild:not(.dash-v1) .app-main :is(h1, h2, h3, h4) > :is(svg, i) { color: var(--muted); opacity: 1; }

/* ---- Page frame: 4px grid ---- */
@media (min-width: 1024px) {
    .dashboard-root.has-guild:not(.dash-v1) .app-main { padding: 32px 32px 88px; }
}

/* ---- Sidebar: quiet rows, one column of 16px icons, selection = surface step ---- */
.dashboard-root.has-guild:not(.dash-v1) .app-sidebar .nav-link {
    min-height: 36px; padding: 0 8px; gap: 10px; border-radius: 8px;
    font-size: 13px; font-weight: 500; color: color-mix(in srgb, var(--text) 72%, transparent);
    transition: background-color .15s var(--u-ease), color .15s var(--u-ease);
}
.dashboard-root.has-guild:not(.dash-v1) .app-sidebar .nav-link > svg {
    width: 16px; height: 16px; padding: 0; border-radius: 0; background: none;
    color: var(--muted); stroke-width: 1.75;
}
@media (hover: hover) and (pointer: fine) {
    .dashboard-root.has-guild:not(.dash-v1) .app-sidebar .nav-link:hover { background: var(--u-step); color: var(--text); }
}
.dashboard-root.has-guild:not(.dash-v1) .app-sidebar .nav-link.nav-link-active {
    background: var(--u-step-2) !important; color: var(--text) !important;
    box-shadow: inset 0 0 0 1px var(--u-hair) !important;
}
.dashboard-root.has-guild:not(.dash-v1) .app-sidebar .nav-link.nav-link-active > svg { background: none; color: var(--brand); }
.dashboard-root.has-guild:not(.dash-v1) .app-sidebar .nav-section {
    font-size: 12px; font-weight: 500; color: var(--muted); padding: 20px 8px 6px;
}
.dashboard-root.has-guild:not(.dash-v1) .app-sidebar .nav-group-toggle {
    min-height: 36px; padding: 0 8px; margin-top: 4px; border-radius: 8px;
    font-size: 13px; font-weight: 500; color: color-mix(in srgb, var(--text) 72%, transparent);
}
.dashboard-root.has-guild:not(.dash-v1) .app-sidebar .nav-group-toggle[aria-expanded="true"] { color: var(--text); }
.dashboard-root.has-guild:not(.dash-v1) .app-sidebar .nav-group-toggle svg { width: 16px; height: 16px; color: var(--muted); }
@media (hover: hover) and (pointer: fine) {
    .dashboard-root.has-guild:not(.dash-v1) .app-sidebar .nav-group-toggle:hover { background: var(--u-step); color: var(--text); }
}

/* ---- Right rail ---- */
.dashboard-root.has-guild:not(.dash-v1) .app-rightbar .side-block { padding: 16px; }
.dashboard-root.has-guild:not(.dash-v1) .side-title {
    font-family: inherit; font-size: 12px; font-weight: 500; color: var(--muted); padding: 0 0 8px;
}
.dashboard-root.has-guild:not(.dash-v1) .side-title:has(> a) { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.dashboard-root.has-guild:not(.dash-v1) .side-title a { font-weight: 500; color: var(--muted); }
.dashboard-root.has-guild:not(.dash-v1) .app-rightbar .info-row { min-height: 28px; padding: 4px 0; font-size: 13px; }
.dashboard-root.has-guild:not(.dash-v1) .app-rightbar .info-row strong { font-family: inherit; font-size: 13px; font-weight: 500; }
.dashboard-root.has-guild:not(.dash-v1) .app-rightbar .info-row strong.font-mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px; font-weight: 400; color: var(--muted); }

/* V1 too: guildStatus.ejs marks a missing catalog/log channel .bad (it was .off). */
.status-dot.bad { background: var(--red); }

/* Status dots: grey = off, red = missing something it needs, green = on. */
.dashboard-root.has-guild:not(.dash-v1) .status-dot.off { background: var(--u-dim); }
.dashboard-root.has-guild:not(.dash-v1) .status-dot.bad { background: var(--bad-text, var(--red)); }

/* ---- Panels and cards ---- */
.dashboard-root.has-guild:not(.dash-v1) .app-main :is(.panel, .panel-strong) { border-radius: 16px; }
.dashboard-root.has-guild:not(.dash-v1) .app-main .panel.p-5 { padding: 24px; }
@media (max-width: 640px) { .dashboard-root.has-guild:not(.dash-v1) .app-main .panel.p-5 { padding: 16px; } }
.dashboard-root.has-guild:not(.dash-v1) .empty-state { gap: 4px; padding: 32px 16px; border-style: solid; border-color: var(--u-hair); border-radius: 12px; }
.dashboard-root.has-guild:not(.dash-v1) .empty-state > :is(i, svg) { width: 24px; height: 24px; opacity: 1; color: var(--muted); margin-bottom: 8px; }

/* ---- Controls ---- */
.dashboard-root.has-guild:not(.dash-v1) .app-main .btn {
    min-height: 36px; padding: 0 14px; gap: 8px; border-radius: 10px;
    font-weight: 500; letter-spacing: normal; box-shadow: none;
    transition: background-color .15s var(--u-ease), border-color .15s var(--u-ease), color .15s var(--u-ease), transform .1s var(--u-ease);
}
.dashboard-root.has-guild:not(.dash-v1) .app-main .btn:hover { transform: none; }
.dashboard-root.has-guild:not(.dash-v1) .app-main .btn:active { transform: scale(.98); }
.dashboard-root.has-guild:not(.dash-v1) .app-main .btn > svg { width: 16px; height: 16px; }
.dashboard-root.has-guild:not(.dash-v1) .app-main .btn-secondary > svg { color: var(--muted); }
/* Create menu pill sits next to the page's primary action, so it is secondary. */
.dashboard-root.has-guild:not(.dash-v1) .app-main .nx-create-pill {
    min-height: 36px; padding: 0 14px; gap: 8px; border-radius: 10px; font-weight: 500;
    background: var(--u-step-2); color: var(--text); border: 1px solid var(--u-hair); box-shadow: none;
}
.dashboard-root.has-guild:not(.dash-v1) .app-main .nx-create-pill > svg { width: 16px; height: 16px; color: var(--muted); }
.dashboard-root.has-guild:not(.dash-v1) :is(.app-main, .app-rightbar) .badge { min-height: 24px; padding: 0 8px; border-radius: 6px; font-size: 12px; font-weight: 500; }
.dashboard-root.has-guild:not(.dash-v1) :is(.app-main, .app-sidebar, .app-rightbar) :focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }

/* ---- Signature: channels and roles read as Discord mentions ---- */
.dashboard-root.has-guild:not(.dash-v1) .mention {
    display: inline-block; padding: 0 4px; border-radius: 4px; font-weight: 500;
    color: color-mix(in srgb, var(--brand) 70%, var(--text));
    background: color-mix(in srgb, var(--brand) 14%, transparent);
}

/* ---- Shared overview-era pieces that other pages reuse ---- */
.dashboard-root.has-guild:not(.dash-v1) .activity-card-icon,
.dashboard-root.has-guild:not(.dash-v1) .setup-check-icon { background: none !important; border: 0 !important; box-shadow: none !important; color: var(--muted) !important; }
.dashboard-root.has-guild:not(.dash-v1) .setup-check-item.is-done .setup-check-icon { color: var(--ok-text) !important; }
.dashboard-root.has-guild:not(.dash-v1) .setup-progress { height: 4px; border-radius: 2px; background: var(--u-step-2); }
.dashboard-root.has-guild:not(.dash-v1) .setup-progress span { border-radius: 2px; background: var(--brand); box-shadow: none; }
.dashboard-root.has-guild:not(.dash-v1) .setup-check-state.badge-warn { background: var(--u-step); border: 1px solid var(--u-hair); color: var(--text); }
.dashboard-root.has-guild:not(.dash-v1) .setup-check-state.badge-good { background: none; border: 0; color: var(--ok-text); }

/* ---- Icon tiles across pages: neutral, the icon is enough ---- */
.dashboard-root.has-guild:not(.dash-v1) :is(.module-icon, .tk-ico, .nx-qc-ico, .wz-aside-icon) {
    background: var(--u-step-2) !important; border: 1px solid var(--u-hair) !important;
    box-shadow: none !important; color: var(--muted) !important; border-radius: 10px;
}
.dashboard-root.has-guild:not(.dash-v1) .module-icon > svg { color: var(--muted) !important; }
.dashboard-root.has-guild:not(.dash-v1) .nx-guide-mark { background: var(--u-step-2) !important; color: var(--text) !important; font-weight: 500 !important; box-shadow: none !important; }
.dashboard-root.has-guild:not(.dash-v1) .nx-qc { background: var(--card-bg) !important; border-color: var(--card-line) !important; }
.dashboard-root.has-guild:not(.dash-v1) .tk-num { color: var(--text) !important; font-weight: 600 !important; }

/* The orb next to section headings is decoration; empty states keep theirs. */
.dashboard-root.has-guild:not(.dash-v1) .app-main :is(h1, h2, h3) > .nx-orb { display: none; }

/* Form labels: sentence-case sans, not tiny bold mono. */
.dashboard-root.has-guild:not(.dash-v1) .app-main .label { font-family: inherit; font-size: 12px; font-weight: 500; letter-spacing: normal; color: var(--muted); }

/* Top bar promos and the theme toggle drop their own hues. */
.dashboard-root.has-guild:not(.dash-v1) :is(.topbar-vote-btn, .topbar-donors-btn),
.dashboard-root.has-guild:not(.dash-v1) :is(.topbar-vote-btn, .topbar-donors-btn) svg,
.dashboard-root.has-guild:not(.dash-v1) :is(.sky-icon-sun, .sky-icon-moon) { color: var(--muted) !important; }

/* First-visit wizard: one solid button, no two-hue gradients. */
.dashboard-root.has-guild:not(.dash-v1) :is(.wz-cta, .wz-done) { background: var(--brand) !important; background-image: none !important; box-shadow: none !important; }
.dashboard-root.has-guild:not(.dash-v1) .wz-logo { background: var(--u-step-2) !important; background-image: none !important; box-shadow: none !important; }

@media (prefers-reduced-motion: reduce) {
    .dashboard-root.has-guild:not(.dash-v1) .app-main .btn:active { transform: none; }
}
