@import url("https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@500;600;700&display=swap");

:root {
    --dashboard-ink: #16202a;
    --dashboard-muted: #687684;
    --dashboard-line: #dfe7e6;
    --dashboard-paper: #f4f7f5;
    --dashboard-coral: #ee765d;
    --dashboard-mint: #9bd8c6;
    --dashboard-mint-dark: #277c70;
}

body:has(.landing-page) {
    background: var(--dashboard-paper);
    color: var(--dashboard-ink);
    font-family: "DM Sans", sans-serif;
}

body:has(.landing-page) .dashboard-nav {
    background: var(--dashboard-ink) !important;
}

.landing-page {
    margin: 0 auto;
    max-width: 1220px;
    padding: 34px 24px 110px;
}

.landing-hero {
    align-items: center;
    animation: landing-reveal .6s both;
    background: var(--dashboard-ink);
    border-radius: 8px;
    color: #f7fbf8;
    display: flex;
    justify-content: space-between;
    min-height: 390px;
    overflow: hidden;
    padding: 58px 64px;
    position: relative;
}

.landing-hero::after {
    background: var(--dashboard-coral);
    border-radius: 50%;
    content: "";
    height: 440px;
    opacity: .9;
    position: absolute;
    right: -150px;
    top: -210px;
    width: 440px;
}

.landing-hero-content {
    max-width: 690px;
    position: relative;
    z-index: 1;
}

.landing-kicker {
    color: var(--dashboard-mint);
    display: block;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .13em;
    text-transform: uppercase;
}

.landing-kicker i { margin-right: 6px; }

.landing-hero h1 {
    color: #f7fbf8;
    font-family: "Space Grotesk", sans-serif;
    font-size: clamp(2.6rem, 6vw, 5.1rem);
    letter-spacing: -.055em;
    line-height: .98;
    margin: 20px 0 20px;
    max-width: 700px;
}

.landing-hero p {
    color: #b8c9c7;
    font-size: 1.08rem;
    line-height: 1.6;
    margin: 0;
    max-width: 530px;
}

.landing-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 30px;
}

.landing-button {
    align-items: center;
    border-radius: 5px;
    display: inline-flex;
    font-size: .8rem;
    font-weight: 700;
    gap: 8px;
    padding: 13px 17px;
    text-decoration: none;
    transition: background .2s ease, color .2s ease, transform .2s ease;
}

.landing-button:hover { transform: translateY(-2px); }
.landing-button-primary { background: var(--dashboard-coral); color: #fff !important; }
.landing-button-primary:hover { background: #d9604d; color: #fff !important; }
.landing-button-secondary { background: rgba(155, 216, 198, .13); color: var(--dashboard-mint) !important; }
.landing-button-secondary:hover { background: rgba(155, 216, 198, .23); color: #fff !important; }
.landing-hero-mark { color: rgba(255, 255, 255, .12); font-size: 9rem; position: relative; z-index: 1; }

.landing-capabilities { padding-top: 84px; }

.landing-section-heading {
    align-items: end;
    display: flex;
    justify-content: space-between;
    margin-bottom: 24px;
}

.landing-section-heading h2 {
    color: var(--dashboard-ink);
    font-family: "Space Grotesk", sans-serif;
    font-size: 2rem;
    letter-spacing: -.035em;
    margin: 8px 0 0;
}

.landing-section-note { color: var(--dashboard-muted); font-size: .8rem; }

.landing-feature-grid {
    display: grid;
    gap: 16px;
    grid-template-columns: repeat(3, 1fr);
}

.landing-feature {
    animation: landing-reveal .5s both;
    background: #fff;
    border: 1px solid var(--dashboard-line);
    border-left: 3px solid var(--dashboard-coral);
    border-radius: 8px;
    min-height: 270px;
    padding: 24px;
    position: relative;
    transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

.landing-feature:nth-child(2) { animation-delay: 90ms; }
.landing-feature:nth-child(3) { animation-delay: 180ms; }
.landing-feature:hover { border-left-color: var(--dashboard-mint-dark); box-shadow: 0 16px 32px rgba(22, 32, 42, .1); transform: translateY(-4px); }

.landing-feature-icon {
    align-items: center;
    background: #16202a;
    border-radius: 50%;
    display: flex;
    height: 48px;
    justify-content: center;
    margin-bottom: 34px;
    width: 48px;
}

.landing-feature-icon img { height: 25px; width: 25px; }
.landing-feature-index { color: var(--dashboard-coral); font-size: .7rem; font-weight: 700; position: absolute; right: 22px; top: 26px; }
.landing-feature h3 { color: var(--dashboard-ink); font-family: "Space Grotesk", sans-serif; font-size: 1.25rem; margin: 0 0 10px; }
.landing-feature p { color: var(--dashboard-muted); font-size: .88rem; line-height: 1.6; margin: 0; }

body.dark-mode:has(.landing-page) { background: #11181e !important; }
body.dark-mode:has(.landing-page) .landing-hero { background: #18232c !important; color: #f7fbf8; }
body.dark-mode:has(.landing-page) .landing-hero h1 { color: #f7fbf8 !important; }
body.dark-mode:has(.landing-page) .landing-hero p { color: #b8c9c7 !important; }
body.dark-mode .landing-section-heading h2 { color: #f2f5f4; }
body.dark-mode .landing-feature { background: #1c2730; border-color: #3a454b; border-left-color: var(--dashboard-coral); }
body.dark-mode .landing-feature:hover { border-left-color: var(--dashboard-mint-dark); }
body.dark-mode .landing-feature h3 { color: #f2f5f4; }

.bug-report-page,
.bug-reports-page {
    margin: 0 auto;
    max-width: 1040px;
    padding: 36px 24px 100px;
}

.bug-report-page .dashboard-hero,
.bug-reports-page .dashboard-hero {
    align-items: center;
    background: var(--dashboard-ink);
    border-radius: 8px;
    color: #f7fbf8;
    display: flex;
    justify-content: space-between;
    margin-bottom: 24px;
    min-height: 205px;
    overflow: hidden;
    padding: 34px 42px;
    position: relative;
}

.bug-report-page .dashboard-hero::after,
.bug-reports-page .dashboard-hero::after {
    background: var(--dashboard-coral);
    border-radius: 50%;
    content: "";
    height: 280px;
    opacity: .8;
    position: absolute;
    right: -115px;
    top: -150px;
    width: 280px;
}

.bug-report-page .dashboard-hero > div:first-child,
.bug-reports-page .dashboard-hero > div:first-child {
    max-width: 720px;
    position: relative;
    z-index: 1;
}

.bug-report-page .dashboard-kicker,
.bug-reports-page .dashboard-kicker {
    color: var(--dashboard-mint-dark);
    display: block;
    font-size: .7rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.bug-report-page .dashboard-hero .dashboard-kicker,
.bug-reports-page .dashboard-hero .dashboard-kicker {
    color: var(--dashboard-mint);
}

.bug-report-page .dashboard-hero h1,
.bug-reports-page .dashboard-hero h1 {
    color: #f7fbf8;
    font-family: "Space Grotesk", sans-serif;
    font-size: clamp(2rem, 4vw, 3.1rem);
    letter-spacing: -.045em;
    margin: 12px 0 8px;
}

.bug-report-page .dashboard-hero p,
.bug-reports-page .dashboard-hero p {
    color: #b8c9c7;
    line-height: 1.6;
    margin: 0;
    max-width: 620px;
}

.bug-report-page .dashboard-hero-mark,
.bug-reports-page .dashboard-hero-mark {
    color: rgba(255, 255, 255, .13);
    font-size: 5rem;
    position: relative;
    z-index: 1;
}

.bug-report-card,
.bug-reports-summary {
    background: #fff;
    border: 1px solid var(--dashboard-line);
    border-radius: 8px;
    margin-bottom: 18px;
    padding: 26px;
}

.bug-report-card-heading {
    margin-bottom: 22px;
}

.bug-report-card-heading h2,
.bug-reports-empty h2 {
    color: var(--dashboard-ink);
    font-family: "Space Grotesk", sans-serif;
    font-size: 1.4rem;
    letter-spacing: -.025em;
    margin: 6px 0 0;
}

.bug-report-uuid {
    align-items: center;
    background: #f4f7f5;
    border: 1px solid var(--dashboard-line);
    border-radius: 5px;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 24px;
    padding: 13px 15px;
}

.bug-report-uuid span,
.bug-report-field label {
    color: var(--dashboard-ink);
    font-size: .86rem;
    font-weight: 700;
}

.bug-report-uuid code,
.bug-report-list-heading code {
    color: var(--dashboard-coral);
    font-size: .84rem;
    overflow-wrap: anywhere;
}

.bug-report-field {
    margin-bottom: 20px;
}

.bug-report-field label {
    display: block;
    margin-bottom: 8px;
}

.bug-report-field .form-control {
    background: #fff;
    border: 1px solid #cfd9d7;
    border-radius: 5px;
    color: var(--dashboard-ink);
    min-height: 46px;
}

.bug-report-field textarea.form-control {
    min-height: 150px;
    resize: vertical;
}

.bug-report-field .form-control:focus {
    border-color: var(--dashboard-mint-dark);
    box-shadow: 0 0 0 3px rgba(39, 124, 112, .14);
}

.bug-report-field small {
    color: var(--dashboard-muted);
    display: block;
    font-size: .78rem;
    line-height: 1.5;
    margin-top: 7px;
}

.bug-report-submit,
.bug-report-action {
    align-items: center;
    background: var(--dashboard-coral);
    border: 0;
    border-radius: 5px;
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    font-size: .84rem;
    font-weight: 700;
    gap: 8px;
    padding: 12px 16px;
    transition: background .2s ease, transform .2s ease;
}

.bug-report-submit:hover,
.bug-report-action:hover {
    background: #d9604d;
    color: #fff;
    transform: translateY(-1px);
}

.bug-report-notice {
    align-items: flex-start;
    border: 1px solid transparent;
    border-radius: 6px;
    display: flex;
    gap: 10px;
    line-height: 1.5;
    margin: 0 0 18px;
    padding: 14px 16px;
}

.bug-report-notice i { margin-top: 2px; }
.bug-report-notice-success { background: #e9f7ef; border-color: #b4dfc2; color: #23643d; }
.bug-report-notice-info { background: #eaf4f8; border-color: #bfd9e5; color: #285c70; }
.bug-report-notice-error { background: #fff0ed; border-color: #f1c3b9; color: #8d3a2c; }

.bug-reports-summary {
    align-items: center;
    display: flex;
    gap: 36px;
}

.bug-reports-summary > div {
    display: grid;
    gap: 2px;
}

.bug-reports-summary strong {
    color: var(--dashboard-ink);
    font-family: "Space Grotesk", sans-serif;
    font-size: 1.8rem;
}

.bug-reports-summary span,
.bug-reports-summary p {
    color: var(--dashboard-muted);
    font-size: .83rem;
    margin: 0;
}

.bug-reports-list {
    display: grid;
    gap: 16px;
}

.bug-reports-list .bug-report-card { margin: 0; }
.bug-report-list-heading { align-items: flex-start; display: flex; gap: 16px; justify-content: space-between; }
.bug-report-list-heading h2 { overflow-wrap: anywhere; }

.bug-report-status {
    align-items: center;
    border-radius: 20px;
    display: inline-flex;
    flex: 0 0 auto;
    font-size: .76rem;
    font-weight: 700;
    gap: 6px;
    padding: 6px 10px;
}

.bug-report-status-open { background: #fff0ed; color: #9b412f; }
.bug-report-status-resolved { background: #e9f7ef; color: #23643d; }

.bug-report-meta {
    color: var(--dashboard-muted);
    display: flex;
    flex-wrap: wrap;
    font-size: .78rem;
    gap: 8px 22px;
    margin: -8px 0 16px;
}

.bug-report-meta span { overflow-wrap: anywhere; }

.bug-report-description {
    background: #f4f7f5;
    border-radius: 5px;
    color: var(--dashboard-ink);
    font-size: .9rem;
    line-height: 1.65;
    margin: 0 0 18px;
    overflow-wrap: anywhere;
    padding: 15px;
    white-space: pre-wrap;
}

.bug-report-action {
    background: #277c70;
    font-size: .8rem;
    padding: 10px 13px;
}

.bug-report-action:hover { background: #20665d; }
.bug-reports-empty { padding: 46px 24px; text-align: center; }
.bug-reports-empty > i { color: #277c70; font-size: 2.2rem; }
.bug-reports-empty h2 { margin-top: 10px; }
.bug-reports-empty p { color: var(--dashboard-muted); margin: 8px 0 0; }

body.dark-mode .bug-report-page .dashboard-hero,
body.dark-mode .bug-reports-page .dashboard-hero { background: #18232c; }

body.dark-mode .bug-report-card,
body.dark-mode .bug-reports-summary {
    background: #1c2730;
    border-color: #3a454b;
}

body.dark-mode .bug-report-card-heading h2,
body.dark-mode .bug-reports-empty h2,
body.dark-mode .bug-report-uuid span,
body.dark-mode .bug-report-field label,
body.dark-mode .bug-reports-summary strong { color: #f2f5f4; }

body.dark-mode .bug-report-uuid,
body.dark-mode .bug-report-description {
    background: #16202a;
    border-color: #3a454b;
    color: #e3ece9;
}

body.dark-mode .bug-report-field .form-control {
    background: #16202a;
    border-color: #4a585e;
    color: #f2f5f4;
}

body.dark-mode .bug-report-field .form-control:focus { border-color: var(--dashboard-mint); }
body.dark-mode .bug-report-field small,
body.dark-mode .bug-reports-summary span,
body.dark-mode .bug-reports-summary p,
body.dark-mode .bug-report-meta { color: #aab9b7; }
body.dark-mode .bug-report-notice-success { background: #173326; border-color: #315a43; color: #bde7ca; }
body.dark-mode .bug-report-notice-info { background: #172f39; border-color: #315260; color: #c4e2ee; }
body.dark-mode .bug-report-notice-error { background: #3c2522; border-color: #704038; color: #ffd2c8; }
body.dark-mode .bug-report-status-open { background: #3c2522; color: #ffd2c8; }
body.dark-mode .bug-report-status-resolved { background: #173326; color: #bde7ca; }

@media (max-width: 640px) {
    .bug-report-page,
    .bug-reports-page { padding: 24px 16px 70px; }
    .bug-report-page .dashboard-hero,
    .bug-reports-page .dashboard-hero { min-height: 0; padding: 28px 24px; }
    .bug-report-page .dashboard-hero-mark,
    .bug-reports-page .dashboard-hero-mark { display: none; }
    .bug-report-card,
    .bug-reports-summary { padding: 20px; }
    .bug-reports-summary { align-items: flex-start; flex-wrap: wrap; gap: 18px 30px; }
    .bug-report-list-heading { flex-direction: column; }
}
body.dark-mode .landing-feature-icon { background: #23433e; }
body.dark-mode .landing-section-note { color: var(--dashboard-muted); }

@keyframes landing-reveal { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

@media (max-width: 760px) {
    .landing-page { padding: 24px 16px 80px; }
    .landing-hero { min-height: 460px; padding: 38px 28px; }
    .landing-hero-mark { bottom: 14px; font-size: 6rem; position: absolute; right: 22px; }
    .landing-section-heading { align-items: start; flex-direction: column; gap: 8px; }
    .landing-feature-grid { grid-template-columns: 1fr; }
}

body:has(.dashboard-shell),
body:has(.server-dashboard) { padding-top: 64px !important; }

.dashboard-nav {
    align-items: center;
    background: var(--dashboard-ink) !important;
    border-bottom: 1px solid rgba(255, 255, 255, .1);
    box-shadow: 0 5px 18px rgba(22, 32, 42, .12);
    display: flex;
    height: 64px;
    padding: 0 !important;
}

.dashboard-nav .container { max-width: 1220px; }
.dashboard-nav .nav-sections { align-items: center; display: flex; gap: 28px; min-height: 64px; }
.dashboard-nav .nav-brand { flex: 0 0 auto; }
.dashboard-nav .brand-link { align-items: center; color: #f7fbf8 !important; display: inline-flex; line-height: 1; text-decoration: none; }
.dashboard-nav .brand-mark { align-items: center; background: transparent; display: flex; flex: 0 0 128px; height: 38px; justify-content: center; width: 128px; }
.dashboard-nav .brand-mark img { display: block; height: 100%; object-fit: contain; width: 100%; }
.dashboard-nav .nav-list { align-items: center; display: flex; justify-content: space-between; width: 100%; }
.dashboard-nav .nav-list ul { align-items: center; display: flex; gap: 5px; list-style: none; margin: 0; padding: 0; }
.dashboard-nav .nav-list li { align-items: center; display: flex; margin: 0; }
.dashboard-nav .nav-list a { align-items: center; border-radius: 5px; color: #b8c9c7 !important; display: inline-flex; font-size: .76rem; font-weight: 700; gap: 7px; height: 36px; line-height: 1; padding: 0 12px; text-decoration: none; text-transform: none; transition: background .2s ease, color .2s ease; }
.dashboard-nav .nav-list a:hover,
.dashboard-nav .nav-list a:focus-visible { background: rgba(255, 255, 255, .09); color: #fff !important; }
.dashboard-nav .nav-ticket-icon { height: .9rem; object-fit: contain; width: .9rem; }
.dashboard-nav .nav-actions a:first-child { background: rgba(155, 216, 198, .12); color: var(--dashboard-mint) !important; }
.dashboard-nav .nav-actions a.nav-current { background: rgba(238, 118, 93, .16); border-bottom: 2px solid var(--dashboard-coral); border-radius: 5px 5px 0 0; color: #fff !important; }
.dashboard-nav .nav-actions a.nav-current i { color: var(--dashboard-coral); }
.dashboard-nav .nav-actions .nav-logout { color: #d8a6a0 !important; }
.dashboard-nav .nav-actions .nav-logout:hover { background: rgba(238, 118, 93, .12); color: #ffb3a3 !important; }
.theme-toggle { align-items: center; background: rgba(155, 216, 198, .12); border: 0; border-radius: 5px; box-sizing: border-box; color: var(--dashboard-mint); display: inline-flex; font: inherit; height: 36px; justify-content: center; line-height: 1; padding: 0; transition: background .2s ease, color .2s ease; width: 36px; }
.theme-toggle:hover { background: rgba(155, 216, 198, .2); color: #fff; }
.theme-toggle:focus-visible { outline: 2px solid var(--dashboard-mint); outline-offset: 2px; }
.theme-toggle i { align-items: center; color: currentColor; display: flex; font-size: 1rem; height: 1rem; justify-content: center; line-height: 1; width: 1rem; }
.theme-toggle i::before { line-height: 1; vertical-align: 0; }

body:has(.dashboard-shell) .dashboard-nav,
body:has(.server-dashboard) .dashboard-nav { background: var(--dashboard-ink) !important; }

body:has(.dashboard-shell) {
    background: var(--dashboard-paper);
    color: var(--dashboard-ink);
    font-family: "DM Sans", sans-serif;
}

body:has(.dashboard-shell) p,
body:has(.dashboard-shell) a,
body:has(.dashboard-shell) span,
body:has(.dashboard-shell) li,
body:has(.dashboard-shell) strong { color: var(--dashboard-ink) !important; }

body:has(.dashboard-shell) nav {
    background: #16202a;
    border-bottom: 1px solid rgba(255, 255, 255, .09);
}

body:has(.dashboard-shell) nav a { color: #dce9e5; }
body:has(.dashboard-shell) nav a:hover { color: var(--dashboard-mint); }
body:has(.dashboard-shell) h1,
body:has(.dashboard-shell) h2,
body:has(.dashboard-shell) h3 { color: var(--dashboard-ink); }
body:has(.dashboard-shell) .dashboard-hero h1 { color: #f7fbf8; }
body:has(.dashboard-shell) .dashboard-nav a,
body:has(.dashboard-shell) .dashboard-nav span { color: #b8c9c7 !important; }
body:has(.dashboard-shell) .dashboard-nav .brand-link,
body:has(.dashboard-shell) .dashboard-nav .brand-mark { color: #f7fbf8 !important; }
body:has(.dashboard-shell) .dashboard-hero p,
body:has(.dashboard-shell) .dashboard-hero span { color: #b8c9c7 !important; }
body:has(.dashboard-shell) .dashboard-hero .dashboard-kicker { color: var(--dashboard-mint) !important; }

.dashboard-shell {
    max-width: 1180px;
    margin: 0 auto;
    padding: 28px 24px 110px;
}

.dashboard-hero {
    align-items: center;
    background: var(--dashboard-ink);
    border-radius: 8px;
    color: #f7fbf8;
    display: flex;
    justify-content: space-between;
    min-height: 248px;
    overflow: hidden;
    padding: 46px 56px;
    position: relative;
}

.dashboard-hero::after {
    background: var(--dashboard-coral);
    border-radius: 50%;
    content: "";
    height: 340px;
    opacity: .9;
    position: absolute;
    right: -110px;
    top: -165px;
    width: 340px;
}

.dashboard-kicker {
    color: var(--dashboard-mint-dark);
    display: block;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .13em;
    text-transform: uppercase;
}

.dashboard-hero .dashboard-kicker { color: var(--dashboard-mint); }
.dashboard-kicker i { margin-right: 6px; }

.dashboard-hero h1 {
    font-family: "Space Grotesk", sans-serif;
    font-size: clamp(2rem, 4vw, 3.55rem);
    letter-spacing: -.04em;
    line-height: 1.05;
    margin: 18px 0 12px;
    max-width: 650px;
}

.dashboard-hero p { color: #b8c9c7; font-size: 1.05rem; margin: 0; }
.dashboard-hero-mark { color: rgba(255, 255, 255, .12); font-size: 7rem; position: relative; z-index: 1; }

.dashboard-overview {
    align-items: stretch;
    display: grid;
    gap: 16px;
    grid-template-columns: 1fr 1fr 1.45fr;
    margin: 18px 0 74px;
}

.overview-stat, .overview-note {
    align-items: center;
    background: #fff;
    border: 1px solid var(--dashboard-line);
    border-radius: 8px;
    display: flex;
    gap: 14px;
    min-height: 94px;
    padding: 18px 20px;
}

.stat-icon { align-items: center; border-radius: 50%; display: flex; flex: 0 0 46px; height: 46px; justify-content: center; }
.stat-icon-coral { background: #fff0ec; color: var(--dashboard-coral); }
.stat-icon-mint { background: #e7f5f0; color: var(--dashboard-mint-dark); }
.overview-stat strong { display: block; font-family: "Space Grotesk", sans-serif; font-size: 1.4rem; }
.overview-stat div span { color: var(--dashboard-muted); display: block; font-size: .78rem; margin-top: 2px; }
.overview-note { color: var(--dashboard-muted); font-size: .88rem; line-height: 1.45; }
.overview-note i { color: var(--dashboard-coral); font-size: 1.25rem; }

.section-heading { align-items: end; display: flex; justify-content: space-between; margin-bottom: 24px; }
.section-heading h2 { font-family: "Space Grotesk", sans-serif; font-size: 2rem; letter-spacing: -.035em; margin: 8px 0 0; }
.section-count { color: var(--dashboard-muted); font-size: .82rem; }
.guild-grid { display: grid; gap: 18px; grid-template-columns: repeat(3, 1fr); }

.guild-tile {
    animation: dashboard-reveal .5s both;
    animation-delay: calc(var(--tile-order) * 70ms);
    background: #fff;
    border: 1px solid var(--dashboard-line);
    border-radius: 8px;
    color: var(--dashboard-ink);
    display: flex;
    flex-direction: column;
    min-height: 282px;
    padding: 22px;
    text-decoration: none;
    transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

.guild-tile:hover { border-color: var(--dashboard-coral); box-shadow: 0 16px 34px rgba(22, 32, 42, .1); color: var(--dashboard-ink); transform: translateY(-4px); }
.guild-tile-top { align-items: center; color: var(--dashboard-muted); display: flex; font-size: .72rem; justify-content: space-between; text-transform: uppercase; }
.guild-tile-top > i { color: var(--dashboard-coral); font-size: 1.15rem; }
.guild-status { align-items: center; display: inline-flex; gap: 6px; }
.guild-status span { background: #5ec59c; border-radius: 50%; height: 7px; width: 7px; }
.guild-icon { border-radius: 22px; height: 76px; margin: 28px 0 18px; object-fit: cover; width: 76px; }
.guild-icon-fallback { align-items: center; background: var(--dashboard-mint); color: var(--dashboard-mint-dark); display: flex; font-family: "Space Grotesk", sans-serif; font-size: 2rem; justify-content: center; }
.guild-tile h3 { font-family: "Space Grotesk", sans-serif; font-size: 1.25rem; margin: 0 0 18px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.guild-action { color: var(--dashboard-muted); font-size: .82rem; margin-top: auto; }
.guild-action i { color: var(--dashboard-coral); margin-left: 5px; }

.guild-empty { align-items: center; background: #fff; border: 1px dashed #b9ccc7; border-radius: 8px; display: flex; gap: 22px; padding: 30px; }
.empty-icon { align-items: center; background: #e7f5f0; border-radius: 50%; color: var(--dashboard-mint-dark); display: flex; flex: 0 0 54px; font-size: 1.35rem; height: 54px; justify-content: center; }
.guild-empty h3 { font-family: "Space Grotesk", sans-serif; font-size: 1.15rem; margin: 0 0 5px; }
.guild-empty p { color: var(--dashboard-muted); font-size: .9rem; margin: 0; }

@keyframes dashboard-reveal { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }

@media (max-width: 900px) {
    .dashboard-overview { grid-template-columns: 1fr 1fr; }
    .overview-note { grid-column: 1 / -1; }
    .guild-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 620px) {
    .dashboard-nav .container { padding-left: 16px; padding-right: 16px; }
    .dashboard-nav .nav-sections { gap: 14px; }
    .dashboard-nav .brand-mark { flex-basis: 34px; height: 34px; width: 34px; }
    .dashboard-nav .nav-list { justify-content: flex-end; }
    .dashboard-nav .nav-list ul { gap: 2px; }
    .dashboard-nav .nav-list a { font-size: 0; height: 36px; justify-content: center; padding: 9px; width: 36px; }
    .dashboard-nav .nav-list a i { font-size: 1rem; }
    .dashboard-nav .nav-actions a:first-child { background: transparent; }
    .dashboard-nav .theme-toggle { height: 36px; width: 36px; }
    .dashboard-nav .nav-actions a.nav-current { background: rgba(238, 118, 93, .16); border-bottom: 0; }
    .dashboard-shell { padding: 24px 16px 80px; }
    .dashboard-hero { min-height: 290px; padding: 32px 26px; }
    .dashboard-hero-mark { bottom: 12px; font-size: 5rem; position: absolute; right: 20px; }
    .dashboard-overview { grid-template-columns: 1fr; margin-bottom: 52px; }
    .overview-note { grid-column: auto; }
    .section-heading { align-items: start; flex-direction: column; gap: 8px; }
    .guild-grid { grid-template-columns: 1fr; }
    .guild-empty { align-items: start; flex-direction: column; }
}

/* Dark dashboard theme */
body.dark-mode {
    --dashboard-ink: #f2f5f4;
    --dashboard-muted: #a8b5b5;
    --dashboard-line: #3a454b;
    --dashboard-paper: #11181e;
    --dashboard-coral: #f27d65;
    --dashboard-mint: #9bd8c6;
    --dashboard-mint-dark: #55b8a4;
    background: var(--dashboard-paper) !important;
}

body.dark-mode .dashboard-hero,
body.dark-mode .server-hero,
body.dark-mode .dashboard-nav { background: #18232c !important; }
body.dark-mode .overview-stat,
body.dark-mode .overview-note,
body.dark-mode .guild-tile,
body.dark-mode .risk-panel,
body.dark-mode .members-panel,
body.dark-mode .forms-content { background: #1c2730; border-color: var(--dashboard-line); }
body.dark-mode .overview-stat div span,
body.dark-mode .overview-note,
body.dark-mode .section-count,
body.dark-mode .guild-tile-top,
body.dark-mode .guild-action,
body.dark-mode .panel-caption,
body.dark-mode .server-metric > span:last-child { color: var(--dashboard-muted) !important; }
body.dark-mode .overview-stat strong,
body.dark-mode .guild-tile h3,
body.dark-mode .section-heading h2,
body.dark-mode .server-intro h2,
body.dark-mode .panel-heading h2,
body.dark-mode .server-metric strong,
body.dark-mode .risk-name strong,
body.dark-mode .members-panel .table td,
body.dark-mode .members-panel .table td span,
body.dark-mode .forms-content .table td,
body.dark-mode .forms-content .table td span { color: #f2f5f4 !important; }
body.dark-mode .member-search,
body.dark-mode .member-settings-button,
body.dark-mode .member-settings-menu,
body.dark-mode .member-filter select { background: #202d36; border-color: var(--dashboard-line); color: #f2f5f4; }
body.dark-mode .member-search .form-control,
body.dark-mode .member-filter select,
body.dark-mode .member-settings-menu label span { color: #f2f5f4 !important; }
body.dark-mode .member-settings-menu label:hover { background: #2b3942; }
body.dark-mode .members-panel .table tbody tr { background: #1c2730 !important; border-color: #334149; }
body.dark-mode .members-panel .table tbody tr:hover { background: #26343e !important; }
body.dark-mode .risk-row { border-color: #334149; }
body.dark-mode .risk-avatar { background: #3a2929; }
body.dark-mode .dashboard-modal-content { background: #1c2730 !important; color: #f2f5f4; }
body.dark-mode .dashboard-modal-content .modal-body,
body.dark-mode .dashboard-modal-content .modal-body p,
body.dark-mode .dashboard-modal-content .modal-body span,
body.dark-mode .dashboard-modal-content .modal-body label,
body.dark-mode .dashboard-modal-content .modal-body li { color: #f2f5f4 !important; }
body.dark-mode .dashboard-modal-content .modal-footer { background: #18232c; border-color: var(--dashboard-line); }
body.dark-mode .profile-modal-content .profile-body { background: #20262b !important; }
body.dark-mode .profile-modal-content .profile-body .username { color: #fff !important; }

/* Shared server workspace */
body:has(.server-dashboard) {
    background: var(--dashboard-paper);
    color: var(--dashboard-ink);
    font-family: "DM Sans", sans-serif;
}

body:has(.server-dashboard) p,
body:has(.server-dashboard) a,
body:has(.server-dashboard) span,
body:has(.server-dashboard) li,
body:has(.server-dashboard) strong { color: var(--dashboard-ink) !important; }

body:has(.server-dashboard) nav {
    background: var(--dashboard-ink);
    border-bottom: 1px solid rgba(255, 255, 255, .09);
}

body:has(.server-dashboard) nav a { color: #dce9e5; }
body:has(.server-dashboard) nav a:hover { color: var(--dashboard-mint); }
body:has(.server-dashboard) h1,
body:has(.server-dashboard) h2,
body:has(.server-dashboard) h3,
body:has(.server-dashboard) strong { color: var(--dashboard-ink); }
body:has(.server-dashboard) .server-hero h1,
body:has(.server-dashboard) .server-hero p,
body:has(.server-dashboard) .server-back-link { color: #f7fbf8; }
body:has(.server-dashboard) .dashboard-nav a,
body:has(.server-dashboard) .dashboard-nav span { color: #b8c9c7 !important; }
body:has(.server-dashboard) .dashboard-nav .brand-link,
body:has(.server-dashboard) .dashboard-nav .brand-mark { color: #f7fbf8 !important; }
body:has(.server-dashboard) .server-hero p,
body:has(.server-dashboard) .server-hero span,
body:has(.server-dashboard) .server-hero a { color: #b8c9c7 !important; }
body:has(.server-dashboard) .server-hero h1,
body:has(.server-dashboard) .server-hero .dashboard-kicker { color: #f7fbf8 !important; }

.server-dashboard { margin: 0 auto; max-width: 1220px; padding: 28px 24px 110px; }
.server-hero { align-items: center; background: var(--dashboard-ink); border-radius: 8px; color: #f7fbf8; display: flex; justify-content: space-between; min-height: 210px; overflow: hidden; padding: 38px 46px; position: relative; }
.server-hero::after { background: var(--dashboard-coral); border-radius: 50%; content: ""; height: 280px; opacity: .9; position: absolute; right: -100px; top: -135px; width: 280px; }
.server-identity { align-items: center; display: flex; gap: 22px; position: relative; z-index: 1; }
.server-icon { border-radius: 20px; height: 86px; object-fit: cover; width: 86px; }
.server-icon-fallback { align-items: center; background: var(--dashboard-mint); color: var(--dashboard-mint-dark); display: flex; font-family: "Space Grotesk", sans-serif; font-size: 2.4rem; justify-content: center; }
.server-hero h1 { font-family: "Space Grotesk", sans-serif; font-size: clamp(2rem, 4vw, 3.1rem); letter-spacing: -.04em; margin: 10px 0 8px; }
.server-hero p { color: #b8c9c7 !important; margin: 0; }
.server-back-link { color: #dce9e5; font-size: .8rem; position: relative; text-decoration: none; z-index: 1; }
.server-back-link:hover { color: var(--dashboard-mint); }
.server-back-link i { margin-right: 5px; }


.server-content { padding-top: 54px; }
.overview-page .members-panel { display: none; }
.members-page .risk-panel,
.members-page .server-metrics { display: none; }
.members-page .server-content { padding-top: 42px; }
.members-page .server-intro { margin-bottom: 26px; }
.server-intro, .panel-heading { align-items: end; display: flex; justify-content: space-between; }
.server-intro h2, .panel-heading h2 { font-family: "Space Grotesk", sans-serif; letter-spacing: -.035em; margin: 8px 0 0; }
.server-intro h2 { font-size: 2rem; }
.dashboard-button { background: var(--dashboard-ink); border-radius: 5px; color: #fff; font-size: .8rem; font-weight: 700; padding: 13px 17px; text-decoration: none; }
.dashboard-button:hover { background: var(--dashboard-mint-dark); color: #fff; }
.dashboard-button i { margin-right: 6px; }

.server-metrics { display: grid; gap: 16px; grid-template-columns: repeat(3, 1fr); margin: 26px 0 46px; }
.server-metric { align-items: center; background: #fff; border: 1px solid var(--dashboard-line); border-radius: 8px; display: grid; grid-template-columns: 45px 1fr; padding: 18px; }
.metric-icon { align-items: center; border-radius: 50%; display: flex; grid-row: span 2; height: 44px; justify-content: center; width: 44px; }
.metric-icon-mint { background: #e7f5f0; color: var(--dashboard-mint-dark); }
.metric-icon-coral { background: #fff0ec; color: var(--dashboard-coral); }
.metric-icon-blue { background: #e9f1fa; color: #4f7fae; }
.server-health-offline .metric-icon-blue { background: #fbe7e5; color: #bd5660; }
.server-health-unconfigured .metric-icon-blue { background: #f3f0e9; color: #907b55; }
.server-health-offline strong { color: #bd5660 !important; }
.server-health-unconfigured strong { color: #907b55 !important; }
.server-metric strong { font-family: "Space Grotesk", sans-serif; font-size: 1.3rem; padding-left: 14px; }
.server-metric > span:last-child { color: var(--dashboard-muted); font-size: .76rem; padding-left: 14px; }

.risk-panel, .members-panel { background: #fff; border: 1px solid var(--dashboard-line); border-radius: 8px; padding: 26px; }
.risk-panel { margin-bottom: 42px; }
.panel-caption { color: var(--dashboard-muted); font-size: .75rem; }
.risk-list { margin-top: 22px; }
.risk-row { align-items: center; border-top: 1px solid #edf1ef; display: flex; gap: 12px; min-height: 68px; }
.risk-avatar { align-items: center; background: #fff0ec; border-radius: 50%; color: var(--dashboard-coral); display: flex; flex: 0 0 34px; font-family: "Space Grotesk", sans-serif; font-weight: 700; height: 34px; justify-content: center; }
.risk-name { display: flex; flex: 1; flex-direction: column; min-width: 0; }
.risk-name strong { font-size: .88rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.risk-name small { color: var(--dashboard-muted) !important; font-size: .7rem; margin-top: 2px; }
.risk-count { color: var(--dashboard-coral); font-size: .76rem; font-weight: 700; }
.dashboard-icon-button { align-items: center; background: #f3f6f5; border: 0; border-radius: 50%; color: var(--dashboard-ink); display: flex; height: 32px; justify-content: center; width: 32px; }
.dashboard-icon-button:hover { background: var(--dashboard-coral); color: #fff; }
.risk-empty { align-items: center; color: var(--dashboard-muted); display: flex; gap: 10px; margin-top: 22px; }
.risk-empty i { color: var(--dashboard-mint-dark); font-size: 1.3rem; }
.members-panel { padding-bottom: 8px; }
.members-heading { margin-bottom: 22px; }
.members-panel .container { max-width: none; padding: 0; }
.member-search { align-items: center; background: #f4f7f5; border: 1px solid var(--dashboard-line); border-radius: 5px; display: flex; margin-bottom: 20px; padding-left: 14px; }
.member-search i { color: var(--dashboard-muted); }
.member-search .form-control { background: transparent !important; border: 0; box-shadow: none; color: var(--dashboard-ink) !important; padding: 13px 12px; }
.members-panel .table { color: var(--dashboard-ink); margin-top: 0 !important; }
.members-panel .table thead { background: var(--dashboard-ink); color: #e8f5f1 !important; }
.members-panel .table thead th { border: 0; font-size: .72rem; padding: 13px 10px; text-transform: uppercase; }
.members-panel .table thead h5 { font-size: inherit; margin: 0; }
.members-panel .table tbody tr { background: #fff !important; border-bottom: 1px solid #edf1ef; }
.members-panel .table tbody tr:hover { background: #f0f7f4 !important; }
.members-panel .table td { border: 0; font-size: .8rem; padding: 13px 10px; vertical-align: middle; }
.members-panel .table td,
.members-panel .table td span,
.members-panel .table td a { color: var(--dashboard-ink) !important; }
.members-panel .table .btn { border: 0; border-radius: 4px; margin-left: 3px; }
.members-panel .table .btn.btn-sm { align-items: center; display: inline-flex; height: 34px; justify-content: center; padding: 6px; width: 42px; }
.members-panel .table .btn.btn-sm i { font-size: .9rem; }
.members-panel .table .btn-primary { background: #4f82b7; color: #fff !important; }
.members-panel .table .btn-warning { background: #df6b55; color: #fff !important; }
.members-panel .table .btn-secondary { background: #53656a; color: #fff !important; }
.members-panel .table .btn-danger { background: #bd5660; color: #fff !important; }
.members-panel .table .btn-primary:hover, .forms-content .table .btn-primary:hover { background: #3d6e9f; }
.members-panel .table .btn-warning:hover, .forms-content .table .btn-warning:hover { background: #c85643; }
.members-panel .table .btn-secondary:hover { background: #3d5055; }
.members-panel .table .btn-danger:hover, .forms-content .table .btn-danger:hover { background: #a94752; }
.members-panel #loadMoreUsers { background: var(--dashboard-ink); border: 0; border-radius: 5px; color: #fff; font-size: .8rem; margin: 18px 0 20px; padding: 12px 18px; }
.members-panel #loadMoreUsers:hover { background: var(--dashboard-mint-dark); }
.member-controls { align-items: end; display: flex; gap: 12px; margin-bottom: 20px; }
.member-controls .member-search { flex: 1; margin-bottom: 0; }
.member-settings { position: relative; }
.member-settings-button { align-items: center; background: #f4f7f5; border: 1px solid var(--dashboard-line); border-radius: 5px; color: var(--dashboard-ink); display: flex; font-size: .78rem; gap: 8px; height: 48px; padding: 0 14px; }
.member-settings-button:hover, .member-settings-button[aria-expanded="true"] { background: var(--dashboard-ink); border-color: var(--dashboard-ink); color: #fff; }
.member-settings-button span { color: var(--dashboard-ink) !important; }
.member-settings-button:hover span, .member-settings-button[aria-expanded="true"] span { color: #fff !important; }
.member-settings-button i { color: var(--dashboard-coral); font-size: 1rem; }
.member-settings-button[aria-expanded="true"] i { color: var(--dashboard-mint); }
.member-settings-menu { background: #fff; border: 1px solid var(--dashboard-line); border-radius: 7px; box-shadow: 0 14px 30px rgba(22, 32, 42, .16); min-width: 235px; padding: 13px; position: absolute; right: 0; top: calc(100% + 8px); z-index: 5; }
.member-settings-menu[hidden] { display: none; }
.member-settings-title { color: var(--dashboard-muted); font-size: .66rem; font-weight: 700; letter-spacing: .1em; margin: 2px 5px 9px; text-transform: uppercase; }
.member-settings-menu label { align-items: center; border-radius: 4px; color: var(--dashboard-ink); cursor: pointer; display: flex; font-size: .82rem; gap: 10px; padding: 10px 5px; }
.member-settings-menu label span { color: var(--dashboard-ink) !important; }
.member-settings-menu label:hover { background: var(--dashboard-paper); }
.member-settings-menu input { accent-color: var(--dashboard-mint-dark); height: 16px; margin: 0; width: 16px; }
body:has(.server-dashboard) .modal-backdrop { background: #101a22; }
body:has(.server-dashboard) .modal-backdrop.show { opacity: .78; }
body:has(.server-dashboard) .modal-dialog { max-width: 620px; }
body:has(.server-dashboard) .dashboard-modal-content { background: #fff !important; border: 0; border-radius: 10px; box-shadow: 0 24px 70px rgba(22, 32, 42, .24); color: var(--dashboard-ink); overflow: hidden; }
body:has(.server-dashboard) .dashboard-modal-content .modal-header { align-items: center; background: var(--dashboard-ink); border: 0; color: #fff; padding: 22px 26px; }
body:has(.server-dashboard) .modal-kicker { color: var(--dashboard-mint); display: block; font-size: .65rem; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }
body:has(.server-dashboard) .dashboard-modal-content .modal-title { color: #fff !important; font-family: "Space Grotesk", sans-serif; font-size: 1.35rem; margin: 6px 0 0; }
body:has(.server-dashboard) .modal-close-floating { position: absolute; right: 14px; top: 14px; z-index: 2; }
body:has(.server-dashboard) .profile-modal-content .modal-close-floating,
.profile-modal-content .modal-close-floating { align-items: center; background: rgba(30, 31, 34, .78) !important; border: 0; border-radius: 50%; color: #fff; display: flex !important; height: 40px; justify-content: center; padding: 0; transition: background .2s ease, transform .2s ease; width: 40px; }
body:has(.server-dashboard) .profile-modal-content .modal-close-floating:hover,
.profile-modal-content .modal-close-floating:hover { background: rgba(88, 101, 242, .95) !important; transform: scale(1.05); }
body:has(.server-dashboard) .profile-modal-content .modal-close-floating i,
.profile-modal-content .modal-close-floating i { display: block; font-size: 1.2rem; line-height: 1; }
body:has(.server-dashboard) .dashboard-modal-content .modal-body { color: var(--dashboard-ink); font-size: .88rem; line-height: 1.65; max-height: min(65vh, 620px); overflow-y: auto; padding: 26px; }
body:has(.server-dashboard) .dashboard-modal-content .modal-body p,
body:has(.server-dashboard) .dashboard-modal-content .modal-body span,
body:has(.server-dashboard) .dashboard-modal-content .modal-body label,
body:has(.server-dashboard) .dashboard-modal-content .modal-body li { color: var(--dashboard-ink) !important; }
body:has(.server-dashboard) .dashboard-modal-content .modal-body textarea,
body:has(.server-dashboard) .dashboard-modal-content .modal-body input { background: #f4f7f5; border: 1px solid var(--dashboard-line); border-radius: 5px; color: var(--dashboard-ink); margin: 6px 0 16px; padding: 11px 13px; }
body:has(.server-dashboard) .dashboard-modal-content .modal-body textarea:focus,
body:has(.server-dashboard) .dashboard-modal-content .modal-body input:focus { border-color: var(--dashboard-mint-dark); box-shadow: 0 0 0 3px rgba(39, 124, 112, .12); }
body:has(.server-dashboard) .dashboard-modal-content .modal-footer { background: #f7f9f8; border-color: var(--dashboard-line); padding: 15px 26px; }
body:has(.server-dashboard) .dashboard-modal-content .modal-footer .btn { border: 0; border-radius: 5px; color: #fff !important; font-size: .78rem; height: auto; padding: 10px 17px; }
body:has(.server-dashboard) .dashboard-modal-content .modal-footer .btn-secondary { background: #53656a; }
body:has(.server-dashboard) .dashboard-modal-content .modal-footer .btn-success { background: var(--dashboard-mint-dark); }
body:has(.server-dashboard) .profile-modal-content,
.profile-modal-content { background: #232428 !important; max-width: 500px; }
body:has(.server-dashboard) .profile-modal-content .card,
.profile-modal-content .card { background: #232428 !important; border: 0; border-radius: 8px; box-shadow: none; overflow: hidden; position: relative; width: 100%; }
body:has(.server-dashboard) .profile-modal-content .card-header,
.profile-modal-content .card-header { background: #1e1f22 !important; border: 0; height: 132px; padding: 0; }
body:has(.server-dashboard) .profile-modal-content .card-header .banner,
body:has(.server-dashboard) .profile-modal-content .card-header .banner-img,
.profile-modal-content .card-header .banner,
.profile-modal-content .card-header .banner-img { background-color: #5865f2 !important; background-position: center; background-size: cover !important; border-radius: 0; height: 100%; width: 100%; }
body:has(.server-dashboard) .profile-modal-content .card-body,
.profile-modal-content .card-body { background: #232428 !important; padding: 0; position: static; }
body:has(.server-dashboard) .profile-modal-content .profile-header,
.profile-modal-content .profile-header { align-items: flex-end; bottom: auto; display: flex; height: 94px; justify-content: space-between; left: 22px; position: absolute; right: 22px; top: 84px; width: auto; }
body:has(.server-dashboard) .profile-modal-content .profile-header .profil-logo,
.profile-modal-content .profile-header .profil-logo { background: #232428; border: 7px solid #232428; border-radius: 50%; height: 102px; width: 102px; }
body:has(.server-dashboard) .profile-modal-content .profile-header .profil-logo img,
.profile-modal-content .profile-header .profil-logo img { border-radius: 50%; height: 88px; object-fit: cover; width: 88px; }
body:has(.server-dashboard) .profile-modal-content .profile-header .profil-logo::before,
.profile-modal-content .profile-header .profil-logo::before { display: none; }
body:has(.server-dashboard) .profile-modal-content .profile-header .badges-container,
.profile-modal-content .profile-header .badges-container { background: #111214; border-radius: 6px; margin-bottom: 12px; max-width: 180px; padding: 3px 6px; }
body:has(.server-dashboard) .profile-modal-content .profile-body,
.profile-modal-content .profile-body { background: #2b2d31 !important; border-radius: 0; margin: 0; padding: 58px 26px 26px; }
body:has(.server-dashboard) .profile-modal-content .profile-body .username,
.profile-modal-content .profile-body .username { color: #fff !important; font-family: "Space Grotesk", sans-serif; font-size: 1.65rem; font-weight: 700; line-height: 1.15; margin: 0 0 6px; }
body:has(.server-dashboard) .profile-modal-content .profile-body hr,
.profile-modal-content .profile-body hr { display: none; }
body:has(.server-dashboard) .profile-modal-content .profile-body .basic-infos,
body:has(.server-dashboard) .profile-modal-content .profile-body .roles,
.profile-modal-content .profile-body .basic-infos,
.profile-modal-content .profile-body .roles { border-top: 1px solid #3f4147; margin: 0; padding: 18px 0 0; }
body:has(.server-dashboard) .profile-modal-content .profile-body .basic-infos + .basic-infos,
body:has(.server-dashboard) .profile-modal-content .profile-body .roles,
.profile-modal-content .profile-body .basic-infos + .basic-infos,
.profile-modal-content .profile-body .roles { margin-top: 18px; }
body:has(.server-dashboard) .profile-modal-content .profile-body .category-title,
.profile-modal-content .profile-body .category-title { color: #b5bac1 !important; font-size: .68rem; font-weight: 700; letter-spacing: .08em; margin-bottom: 8px; text-transform: uppercase; }
body:has(.server-dashboard) .profile-modal-content .profile-body p,
.profile-modal-content .profile-body p { color: #dbdee1 !important; font-size: .86rem; line-height: 1.65; margin: 0; }
body:has(.server-dashboard) .profile-modal-content .roles-list,
.profile-modal-content .roles-list { display: flex; flex-wrap: wrap; gap: 6px; }
body:has(.server-dashboard) .profile-modal-content .roles-list .role,
.profile-modal-content .roles-list .role { background: #1e1f22; border: 1px solid #40434a; border-radius: 4px; color: #dbdee1 !important; font-size: .75rem; margin: 0; padding: 5px 8px; }
body:has(.server-dashboard) .profile-modal-content .roles-list .role .role-color,
.profile-modal-content .roles-list .role .role-color { height: 8px; width: 8px; }
body:has(.server-dashboard) .profile-modal-content .note,
body:has(.server-dashboard) .profile-modal-content .message,
.profile-modal-content .note,
.profile-modal-content .message { border-top: 1px solid #3f4147; margin-top: 18px; padding-top: 18px; }
body:has(.server-dashboard) .profile-modal-content .note textarea,
body:has(.server-dashboard) .profile-modal-content .message input,
.profile-modal-content .note textarea,
.profile-modal-content .message input { background: #1e1f22 !important; border: 1px solid #1e1f22; border-radius: 4px; color: #dbdee1 !important; font-size: .82rem; margin: 4px 0 0; padding: 11px 12px; width: 100%; }
body:has(.server-dashboard) .profile-modal-content .note textarea,
.profile-modal-content .note textarea { min-height: 72px; resize: vertical; }
body:has(.server-dashboard) .profile-modal-content .note textarea::placeholder,
body:has(.server-dashboard) .profile-modal-content .message input::placeholder,
.profile-modal-content .note textarea::placeholder,
.profile-modal-content .message input::placeholder { color: #949ba4; }
body:has(.server-dashboard) .profile-modal-content .note textarea:focus,
body:has(.server-dashboard) .profile-modal-content .message input:focus,
.profile-modal-content .note textarea:focus,
.profile-modal-content .message input:focus { border-color: #5865f2; box-shadow: 0 0 0 2px rgba(88, 101, 242, .25); outline: 0; }
.forms-content { background: #fff; border: 1px solid var(--dashboard-line); border-radius: 8px; margin-top: 22px; max-width: none; padding: 28px; }
.forms-content > .row > .col-12 > p { color: var(--dashboard-muted); margin-bottom: 0; }
.forms-content > .row > .col-12 > hr { border-color: var(--dashboard-line); margin: 24px 0 30px; opacity: 1; }
.forms-content .table { color: var(--dashboard-ink); margin-top: 24px !important; }
.forms-content .table thead { background: var(--dashboard-ink); color: #e8f5f1 !important; }
.forms-content .table thead th { border: 0; font-size: .72rem; padding: 14px 10px; text-transform: uppercase; }
.forms-content .table tbody tr { border-bottom: 1px solid #edf1ef; }
.forms-content .table td,
.forms-content .table td span { border: 0; color: var(--dashboard-ink) !important; font-size: .82rem; padding: 14px 10px; vertical-align: middle; }
.forms-content .table .badge { border-radius: 4px; display: table-cell; font-size: .7rem; font-weight: 700; padding: 7px 10px; }
.forms-content .table .bg-warning { background: #fff0ec !important; color: var(--dashboard-coral) !important; }
.forms-content .table .bg-danger { background: #fbe7e5 !important; color: #bc514b !important; }
.forms-content .table .bg-success { background: #e7f5f0 !important; color: var(--dashboard-mint-dark) !important; }
.forms-content .table .btn { border: 0; border-radius: 4px; margin-left: 3px; }
.forms-content .table td.text-end .btn { align-items: center; display: inline-flex; height: 34px; justify-content: center; padding: 6px; width: 42px; }
.forms-content .table td.text-end .btn i { font-size: .9rem; }
.forms-content .table .btn-primary { background: #4f82b7; color: #fff !important; }
.forms-content .table .btn-success { background: #277c70; color: #fff !important; }
.forms-content .table .btn-warning { background: #df6b55; color: #fff !important; }
.forms-content .table .btn-danger { background: #bd5660; color: #fff !important; }
.forms-content .table .btn-success:hover { background: #1e655c; }

@media (max-width: 760px) {
    .server-dashboard { padding: 24px 16px 80px; }
    .server-hero { align-items: start; flex-direction: column; gap: 24px; padding: 30px 24px; }
    .server-back-link { align-self: end; }
    .server-intro { align-items: start; flex-direction: column; gap: 18px; }
    .server-metrics { grid-template-columns: 1fr; }
    .panel-heading { align-items: start; flex-direction: column; gap: 7px; }
    .risk-count { display: none; }
    .members-panel { margin: 0 -8px; overflow: hidden; padding: 18px 14px 8px; }
    .member-controls { align-items: stretch; flex-direction: column; }
    .member-settings-button { justify-content: center; width: 100%; }
    .member-settings-menu { left: 0; right: 0; }
    .members-panel .table-responsive, .members-panel .table { min-width: 820px; }
}

/* Keep dark mode authoritative over legacy component rules declared above. */
body.dark-mode .dashboard-shell,
body.dark-mode .server-dashboard { color: #f2f5f4; }
body.dark-mode .guild-empty,
body.dark-mode .forms-content .table tbody tr,
body.dark-mode .forms-content .table tbody tr:hover { background: #1c2730 !important; }
body.dark-mode .guild-empty { border-color: #3a454b; }
body.dark-mode .guild-empty p,
body.dark-mode .forms-content > .row > .col-12 > p,
body.dark-mode .forms-content .table td,
body.dark-mode .forms-content .table td span { color: #f2f5f4 !important; }
body.dark-mode .forms-content > .row > .col-12 > hr { border-color: #3a454b; }
body.dark-mode .forms-content .table tbody tr { border-color: #334149; }
body.dark-mode .forms-content .table .bg-warning { background: #49352f !important; color: #ffad98 !important; }
body.dark-mode .forms-content .table .bg-danger { background: #4b2d34 !important; color: #ff9da7 !important; }
body.dark-mode .forms-content .table .bg-success { background: #234a45 !important; color: #9bd8c6 !important; }
body.dark-mode .forms-content .table .btn-primary,
body.dark-mode .forms-content .table .btn-success,
body.dark-mode .forms-content .table .btn-warning,
body.dark-mode .forms-content .table .btn-danger { color: #fff !important; }
body.dark-mode .profile-modal-content .card,
body.dark-mode .profile-modal-content .card-body,
body.dark-mode .profile-modal-content .profile-body { background: #20262b !important; }
body.dark-mode .profile-modal-content .profile-body .username,
body.dark-mode .profile-modal-content .profile-body p { color: #f2f5f4 !important; }
body.dark-mode .profile-modal-content .profile-body .category-title { color: #a8b5b5 !important; }
body.dark-mode .profile-modal-content .profile-body .basic-infos,
body.dark-mode .profile-modal-content .profile-body .roles,
body.dark-mode .profile-modal-content .note,
body.dark-mode .profile-modal-content .message { border-color: #3a454b; }
body.dark-mode .profile-modal-content .roles-list .role { background: #182127; border-color: #46545c; color: #f2f5f4 !important; }
body.dark-mode .profile-modal-content .note textarea,
body.dark-mode .profile-modal-content .message input { background: #151c21 !important; border-color: #3a454b; color: #f2f5f4 !important; }
body.dark-mode .server-metric,
body.dark-mode .overview-stat,
body.dark-mode .overview-note { background: #1c2730 !important; border-color: #3a454b !important; }
body.dark-mode .server-metric strong,
body.dark-mode .server-metric > span:last-child,
body.dark-mode .overview-stat strong,
body.dark-mode .overview-stat div span,
body.dark-mode .overview-note { color: #f2f5f4 !important; }
body.dark-mode .server-metric .metric-icon-mint { background: #23433e !important; color: #9bd8c6 !important; }
body.dark-mode .server-metric .metric-icon-coral { background: #49312f !important; color: #f27d65 !important; }
body.dark-mode .server-metric .metric-icon-blue { background: #293d54 !important; color: #a9c9ee !important; }
body.dark-mode .overview-stat .stat-icon-mint { background: #23433e !important; color: #9bd8c6 !important; }
body.dark-mode .overview-stat .stat-icon-coral { background: #49312f !important; color: #f27d65 !important; }
body.dark-mode:has(.server-dashboard) .dashboard-modal-content { background: #1c2730 !important; color: #f2f5f4 !important; }
body.dark-mode:has(.server-dashboard) .dashboard-modal-content .modal-header { background: #18232c !important; color: #f2f5f4 !important; }
body.dark-mode:has(.server-dashboard) .dashboard-modal-content .modal-title,
body.dark-mode:has(.server-dashboard) .dashboard-modal-content .modal-body,
body.dark-mode:has(.server-dashboard) .dashboard-modal-content .modal-body p,
body.dark-mode:has(.server-dashboard) .dashboard-modal-content .modal-body span,
body.dark-mode:has(.server-dashboard) .dashboard-modal-content .modal-body label,
body.dark-mode:has(.server-dashboard) .dashboard-modal-content .modal-body li { color: #f2f5f4 !important; }
body.dark-mode:has(.server-dashboard) .dashboard-modal-content .modal-footer { background: #18232c !important; border-color: #3a454b !important; }
body.dark-mode:has(.server-dashboard) .dashboard-modal-content .modal-body input,
body.dark-mode:has(.server-dashboard) .dashboard-modal-content .modal-body textarea { background: #151c21 !important; border-color: #3a454b !important; color: #f2f5f4 !important; }
body.dark-mode:has(.server-dashboard) .dashboard-modal-content .modal-body input::placeholder,
body.dark-mode:has(.server-dashboard) .dashboard-modal-content .modal-body textarea::placeholder { color: #a8b5b5 !important; }
body.dark-mode:has(.server-dashboard) .dashboard-modal-content .modal-body input:focus,
body.dark-mode:has(.server-dashboard) .dashboard-modal-content .modal-body textarea:focus { border-color: #55b8a4 !important; box-shadow: 0 0 0 3px rgba(85, 184, 164, .18) !important; }
body.dark-mode .dashboard-modal-content .modal-body .form-control,
body.dark-mode:has(.server-dashboard) .dashboard-modal-content .modal-body .form-control { background: #151c21 !important; border-color: #3a454b !important; color: #f2f5f4 !important; }

body:has(.dashboard-page) {
    background: var(--dashboard-paper);
    color: var(--dashboard-ink);
    font-family: "DM Sans", sans-serif;
}

.dashboard-page {
    max-width: 1180px;
    padding-bottom: 90px;
    padding-top: 28px;
}

.dashboard-page > .row {
    margin-left: 0;
    margin-right: 0;
}

.dashboard-page > .row > .col-12 {
    padding-left: 0;
    padding-right: 0;
}

.dashboard-page h1,
.dashboard-page h2,
.dashboard-page h3,
.dashboard-page h4,
.dashboard-page h5 {
    color: var(--dashboard-ink);
    font-family: "Space Grotesk", sans-serif;
}

.dashboard-page > .row > .col-12 > h3,
.dashboard-page > .row > .col-12 > h1 {
    font-size: 2rem;
    letter-spacing: -.035em;
    margin: 8px 0 12px;
    text-align: left !important;
}

.dashboard-page > .row > hr {
    border-color: var(--dashboard-line) !important;
    margin: 0 0 28px;
    opacity: 1;
}

.dashboard-page p,
.dashboard-page label,
.dashboard-page small,
.dashboard-page .text-muted {
    color: var(--dashboard-muted) !important;
}

.dashboard-page .table {
    background: #fff;
    border: 1px solid var(--dashboard-line);
    border-radius: 8px;
    color: var(--dashboard-ink);
    overflow: hidden;
    vertical-align: middle;
}

.dashboard-page .table thead {
    background: #16202a !important;
    color: #e8f5f1 !important;
}

.dashboard-page .table thead th {
    background: #16202a !important;
    border: 0;
    box-shadow: inset 0 0 0 9999px #16202a !important;
    color: #e8f5f1 !important;
    font-size: .7rem;
    letter-spacing: .05em;
    padding: 14px 12px;
    text-transform: uppercase;
    white-space: nowrap;
}

.dashboard-page .table tbody tr {
    background: #fff !important;
    border-bottom: 1px solid #edf1ef;
    transition: background .2s ease;
}

.dashboard-page .table tbody tr:hover {
    background: #f0f7f4 !important;
}

.dashboard-page .table td {
    border: 0;
    color: var(--dashboard-ink) !important;
    font-size: .8rem;
    padding: 13px 12px;
}

.dashboard-page .table td span,
.dashboard-page .table td a {
    color: inherit !important;
}

.dashboard-page .input-group {
    align-items: center;
    gap: 8px;
    margin-bottom: 20px !important;
}

.dashboard-page .input-group .form-control {
    background: #fff;
    border: 1px solid var(--dashboard-line);
    border-radius: 5px !important;
    box-shadow: none;
    color: var(--dashboard-ink);
    min-height: 46px;
    padding: 11px 13px;
}

.dashboard-page .input-group .form-control:focus,
.dashboard-page .form-control:focus {
    border-color: var(--dashboard-mint-dark);
    box-shadow: 0 0 0 3px rgba(39, 124, 112, .12);
}

.dashboard-page .btn,
.dashboard-page .btn-sm {
    border: 0;
    border-radius: 5px;
    font-size: .78rem;
    font-weight: 700;
    padding: 10px 14px;
}

.dashboard-page .btn-primary { background: #4f82b7; color: #fff !important; }
.dashboard-page .btn-secondary { background: #53656a; color: #fff !important; }
.dashboard-page .btn-success { background: var(--dashboard-mint-dark); color: #fff !important; }
.dashboard-page .btn-warning { background: var(--dashboard-coral); color: #fff !important; }
.dashboard-page .btn-danger { background: #bd5660; color: #fff !important; }
.dashboard-page .btn:hover { filter: brightness(.92); }

.dashboard-page .dashboard {
    padding: 0;
}

.dashboard-page .dashboard > h1 {
    margin-bottom: 28px !important;
    text-align: left !important;
}

.dashboard-page .dashboard > .row {
    display: grid;
    gap: 16px;
    grid-template-columns: repeat(4, 1fr);
}

.dashboard-page .dashboard > .row > [class*="col-"] {
    padding: 0;
    width: auto;
}

.dashboard-page .dashboard .card {
    background: #fff !important;
    border: 1px solid var(--dashboard-line) !important;
    border-radius: 8px !important;
    color: var(--dashboard-ink) !important;
    height: 100%;
    margin: 0 !important;
    padding: 20px !important;
}

.dashboard-page .dashboard .card-header {
    background: transparent !important;
    border: 0;
    color: var(--dashboard-muted) !important;
    padding: 0;
}

.dashboard-page .dashboard .card-header h5 {
    color: var(--dashboard-muted) !important;
    font-family: "DM Sans", sans-serif;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.dashboard-page .dashboard .card-body {
    padding: 18px 0 0;
}

.dashboard-page .dashboard .card-title {
    color: var(--dashboard-ink) !important;
    font-family: "Space Grotesk", sans-serif;
    font-size: 2rem;
    margin-bottom: 8px;
}

.dashboard-page .dashboard .card-text {
    color: var(--dashboard-muted) !important;
    font-size: .82rem;
    margin: 0;
}

.dashboard-page > .row > .col-12 > .card,
.dashboard-page section > .card {
    background: #fff;
    border: 1px solid var(--dashboard-line);
    border-radius: 8px;
    box-shadow: none;
}

.dashboard-page .settings-section > .card {
    background: transparent !important;
    border: 0;
    box-shadow: none;
}

.dashboard-page .settings-section > .card > .card-body {
    background: transparent !important;
    padding: 0;
}

.dashboard-page .section-card {
    background: #fff;
    border: 1px solid var(--dashboard-line);
    border-left: 3px solid var(--dashboard-coral);
    border-radius: 8px;
    box-shadow: 0 10px 24px rgba(22, 32, 42, .06);
    margin-bottom: 18px;
    overflow: hidden;
    transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

.dashboard-page .section-card:hover {
    border-color: var(--dashboard-mint-dark);
    box-shadow: 0 14px 30px rgba(22, 32, 42, .1);
    transform: translateY(-1px);
}

.dashboard-page .section-card-header {
    align-items: center;
    background: #16202a !important;
    background-image: none !important;
    border-bottom: 1px solid rgba(223, 231, 230, .12);
    color: #f7fbf8 !important;
    display: flex;
    min-height: 56px;
    padding: 14px 20px;
}

.dashboard-page .section-card > .section-card-header h5 {
    background: transparent !important;
    color: #f7fbf8 !important;
    font-size: .74rem;
    font-weight: 700;
    letter-spacing: .08em;
    margin: 0;
    text-transform: uppercase;
}

.dashboard-page .section-card-body {
    padding: 22px 20px 24px;
}

.dashboard-page .rules-settings-card .section-card-header {
    justify-content: space-between;
    gap: 16px;
}

.dashboard-page .rules-settings-card .rules-status {
    border-radius: 999px;
    flex: 0 0 auto;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .02em;
    padding: 5px 10px;
    text-transform: none;
}

.dashboard-page .rules-settings-card .rules-status.is-active {
    background: rgba(81, 163, 138, .16);
    color: #8ed5bc;
}

.dashboard-page .rules-settings-card .rules-status.is-disabled {
    background: rgba(160, 173, 178, .14);
    color: #bac4c8;
}

.dashboard-page .rules-settings-card .rules-description {
    color: var(--dashboard-muted);
    font-size: .88rem;
    line-height: 1.6;
    margin: 0 0 20px;
    max-width: 78ch;
}

.dashboard-page .rules-settings-card .rules-options-warning {
    background: #fff7e6;
    border: 1px solid #efd08a;
    border-radius: 6px;
    color: #76591e;
    font-size: .82rem;
    line-height: 1.5;
    margin-bottom: 18px;
    padding: 10px 12px;
}

.dashboard-page .rules-settings-card .rules-fields {
    display: grid;
    gap: 0 20px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.dashboard-page .rules-settings-card .rules-fields .form-group {
    margin-bottom: 18px !important;
}

.dashboard-page .rules-settings-card .rules-text-group {
    grid-column: 1 / -1;
}

.dashboard-page .rules-editor-grid {
    align-items: stretch;
    display: grid;
    gap: 20px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.dashboard-page .rules-editor,
.dashboard-page .rules-preview-column {
    min-width: 0;
}

.dashboard-page .rules-markdown-toolbar {
    align-items: center;
    background: #18232c;
    border: 1px solid var(--dashboard-line);
    border-bottom: 0;
    border-radius: 6px 6px 0 0;
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    min-height: 42px;
    padding: 5px 7px;
}

.dashboard-page .rules-format-button {
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: 4px;
    color: #d6e0e5;
    cursor: pointer;
    display: inline-flex;
    height: 30px;
    justify-content: center;
    padding: 0;
    transition: background .15s ease, color .15s ease;
    width: 32px;
}

.dashboard-page .rules-format-button:hover,
.dashboard-page .rules-format-button:focus-visible {
    background: #303e48;
    color: #fff;
    outline: none;
}

.dashboard-page .rules-format-button svg {
    height: 16px;
    width: 16px;
}

.dashboard-page .rules-toolbar-divider {
    background: #46545d;
    height: 20px;
    margin: 0 3px;
    width: 1px;
}

.dashboard-page .rules-editor .input-icon-field textarea {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    height: auto;
    min-height: 300px;
    overflow-y: hidden;
    resize: none;
}

.dashboard-page .rules-preview-label {
    color: var(--dashboard-muted);
    display: block;
    font-size: .74rem;
    font-weight: 700;
    letter-spacing: .06em;
    margin: 0 0 8px;
    text-transform: uppercase;
}

.dashboard-page .rules-discord-preview {
    background: #313338;
    border: 1px solid #232428;
    border-radius: 7px;
    color: #dbdee1;
    min-height: 342px;
    padding: 18px;
}

.dashboard-page .rules-preview-embed {
    background: #2b2d31;
    border-left: 4px solid #5865f2;
    border-radius: 4px;
    max-width: 100%;
    padding: 14px 16px 12px;
}

.dashboard-page .rules-preview-title {
    color: #f2f3f5;
    font-size: .95rem;
    font-weight: 700;
    margin-bottom: 8px;
    overflow-wrap: anywhere;
}

.dashboard-page .rules-preview-description {
    color: #dbdee1;
    font-size: .88rem;
    line-height: 1.55;
    overflow-wrap: anywhere;
    white-space: normal;
}

.dashboard-page .rules-preview-description:empty::before {
    color: #949ba4;
    content: "Deine Regeln erscheinen hier …";
    font-style: italic;
}

.dashboard-page .rules-preview-description p {
    margin: 0 0 8px;
}

.dashboard-page .rules-preview-description p:last-child {
    margin-bottom: 0;
}

.dashboard-page .rules-preview-description ul,
.dashboard-page .rules-preview-description ol {
    margin: 4px 0 8px;
    padding-left: 22px;
}

.dashboard-page .rules-preview-description blockquote {
    border-left: 3px solid #4e5058;
    color: #b5bac1;
    margin: 4px 0 8px;
    padding-left: 10px;
}

.dashboard-page .rules-preview-description code {
    background: #1e1f22;
    border-radius: 3px;
    font-family: Consolas, monospace;
    font-size: .85em;
    padding: 2px 4px;
}

.dashboard-page .rules-preview-spoiler {
    background: #1e1f22;
    border-radius: 3px;
    color: transparent;
    padding: 0 3px;
}

.dashboard-page .rules-preview-spoiler:hover {
    color: #dbdee1;
}

.dashboard-page .rules-preview-description pre {
    background: #1e1f22;
    border-radius: 4px;
    margin: 6px 0;
    overflow-x: auto;
    padding: 9px;
}

.dashboard-page .rules-preview-description pre code {
    padding: 0;
}

.dashboard-page .rules-preview-footer {
    border-top: 1px solid #3f4147;
    color: #949ba4;
    font-size: .72rem;
    line-height: 1.4;
    margin-top: 12px;
    padding-top: 9px;
}

.dashboard-page .rules-preview-button {
    align-items: center;
    background: #248046;
    border-radius: 5px;
    color: #fff;
    display: flex;
    font-size: 1rem;
    height: 34px;
    justify-content: center;
    margin-top: 8px;
    width: 42px;
}

.dashboard-page .rules-settings-card textarea {
    min-height: 170px;
    resize: vertical;
}

.dashboard-page .rules-settings-card .rules-text-meta {
    align-items: baseline;
    display: flex;
    gap: 16px;
    justify-content: space-between;
}

.dashboard-page .rules-settings-card .rules-text-meta small {
    margin-top: 6px;
}

.dashboard-page .rules-settings-card .rules-character-count {
    color: var(--dashboard-muted);
    flex: 0 0 auto;
    font-size: .76rem;
    font-variant-numeric: tabular-nums;
}

.dashboard-page .section-card-body .form-group {
    margin-bottom: 24px !important;
}

.dashboard-page .section-card-body .form-group:last-child {
    margin-bottom: 0 !important;
}

.dashboard-page .section-card-body label {
    color: var(--dashboard-ink) !important;
    font-size: .84rem;
    font-weight: 700;
}

.bot-errors-page {
    margin: 0 auto;
    max-width: 1040px;
    padding: 36px 24px 100px;
}

.bot-errors-page .dashboard-hero {
    align-items: center;
    background: var(--dashboard-ink);
    border-radius: 8px;
    color: #f7fbf8;
    display: flex;
    justify-content: space-between;
    margin-bottom: 24px;
    min-height: 205px;
    overflow: hidden;
    padding: 34px 42px;
    position: relative;
}

.bot-errors-page .dashboard-hero::after {
    background: var(--dashboard-coral);
    border-radius: 50%;
    content: "";
    height: 280px;
    opacity: .8;
    position: absolute;
    right: -115px;
    top: -150px;
    width: 280px;
}

.bot-errors-page .dashboard-hero > div:first-child {
    max-width: 720px;
    position: relative;
    z-index: 1;
}

.bot-errors-page .dashboard-hero .dashboard-kicker {
    color: var(--dashboard-mint);
    display: block;
    font-size: .7rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.bot-errors-page .dashboard-hero h1 {
    color: #f7fbf8;
    font-family: "Space Grotesk", sans-serif;
    font-size: clamp(2rem, 4vw, 3.1rem);
    letter-spacing: -.045em;
    margin: 12px 0 8px;
}

.bot-errors-page .dashboard-hero p {
    color: #b8c9c7;
    line-height: 1.6;
    margin: 0;
}

.bot-errors-page .dashboard-hero-mark {
    color: rgba(255, 255, 255, .13);
    font-size: 5rem;
    position: relative;
    z-index: 1;
}

.bot-errors-summary { margin-bottom: 18px; }
.bot-errors-summary p { margin-left: auto; }

.bot-errors-search {
    background: #fff;
    border: 1px solid var(--dashboard-line);
    border-radius: 8px;
    margin-bottom: 18px;
    padding: 20px 24px;
}

.bot-errors-search label {
    color: var(--dashboard-ink);
    display: block;
    font-size: .86rem;
    font-weight: 700;
    margin-bottom: 8px;
}

.bot-errors-search > div {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.bot-errors-search input {
    background: #fff;
    border: 1px solid #cfd9d7;
    border-radius: 5px;
    color: var(--dashboard-ink);
    flex: 1 1 260px;
    min-height: 44px;
    padding: 9px 12px;
}

.bot-errors-search button {
    align-items: center;
    background: var(--dashboard-coral);
    border: 0;
    border-radius: 5px;
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    font-size: .82rem;
    font-weight: 700;
    gap: 7px;
    min-height: 44px;
    padding: 10px 14px;
}

.bot-errors-search a {
    color: var(--dashboard-mint-dark);
    font-size: .8rem;
    font-weight: 700;
    text-decoration: none;
}

.bot-errors-list { display: grid; gap: 16px; }
.bot-error-heading { align-items: flex-start; display: flex; gap: 16px; justify-content: space-between; }
.bot-error-heading h2 { color: var(--dashboard-ink); font-family: "Space Grotesk", sans-serif; font-size: 1.1rem; margin: 7px 0 0; overflow-wrap: anywhere; }
.bot-error-heading h2 code { color: var(--dashboard-coral); font-size: .84rem; }
.bot-error-heading time { color: var(--dashboard-muted); flex: 0 0 auto; font-size: .76rem; }
.bot-error-details { border-top: 1px solid var(--dashboard-line); margin-top: 18px; padding-top: 14px; }
.bot-error-details summary { color: var(--dashboard-mint-dark); cursor: pointer; font-size: .84rem; font-weight: 700; }
.bot-error-details pre { background: #f4f7f5; border-radius: 5px; color: var(--dashboard-ink); font-size: .8rem; line-height: 1.55; margin: 12px 0 0; max-height: 600px; overflow: auto; overflow-wrap: anywhere; padding: 14px; white-space: pre-wrap; }
.bot-error-report-link { margin-top: 16px; text-decoration: none; }

body.dark-mode .bot-errors-page .dashboard-hero { background: #18232c; }
body.dark-mode .bot-errors-search { background: #1c2730; border-color: #3a454b; }
body.dark-mode .bot-errors-search label { color: #f2f5f4; }
body.dark-mode .bot-errors-search input { background: #16202a; border-color: #4a585e; color: #f2f5f4; }
body.dark-mode .bot-error-heading h2 { color: #f2f5f4; }
body.dark-mode .bot-error-heading time { color: #aab9b7; }
body.dark-mode .bot-error-details { border-color: #3a454b; }
body.dark-mode .bot-error-details summary { color: var(--dashboard-mint); }
body.dark-mode .bot-error-details pre { background: #16202a; color: #e3ece9; }
body.dark-mode .bot-errors-search a { color: var(--dashboard-mint); }

@media (max-width: 640px) {
    .bot-errors-page { padding: 24px 16px 70px; }
    .bot-errors-page .dashboard-hero { min-height: 0; padding: 28px 24px; }
    .bot-errors-page .dashboard-hero-mark { display: none; }
    .bot-errors-search { padding: 18px; }
    .bot-error-heading { flex-direction: column; }
    .bot-error-heading time { flex: initial; }
}

.dashboard-page .section-card-body small {
    display: block;
    font-size: .76rem;
    line-height: 1.5;
    margin-top: 7px;
}

.dashboard-page .section-card-body .form-control,
.dashboard-page .section-card-body textarea {
    background: #f4f7f5;
    border: 1px solid var(--dashboard-line);
    border-radius: 5px;
    color: var(--dashboard-ink);
}

.dashboard-page .input-icon-field {
    position: relative;
}

.dashboard-page .input-icon-field > svg.lucide,
.dashboard-page .input-icon-field > i[data-lucide] {
    color: var(--dashboard-muted);
    height: 17px;
    left: 13px;
    pointer-events: none;
    position: absolute;
    stroke-width: 1.8;
    top: 50%;
    transform: translateY(-50%);
    width: 17px;
    z-index: 2;
}

.dashboard-page .input-icon-field > .form-control {
    padding-left: 42px;
}

.dashboard-page .input-icon-field > textarea.form-control {
    padding-top: 12px;
}

.dashboard-page .input-icon-field:has(textarea) > svg.lucide,
.dashboard-page .input-icon-field:has(textarea) > i[data-lucide] {
    top: 13px;
    transform: none;
}

.dashboard-page .chat-container {
    background: #fff;
    border: 1px solid var(--dashboard-line);
    border-radius: 8px;
    color: var(--dashboard-ink);
    margin-top: 0;
    padding: 24px;
}

.dashboard-page .message {
    background: #f4f7f5;
    border: 1px solid var(--dashboard-line);
    border-radius: 7px;
    color: var(--dashboard-ink);
    margin: 0 0 12px;
    padding: 14px 16px;
}

.dashboard-page .message-author {
    color: var(--dashboard-coral);
    font-family: "Space Grotesk", sans-serif;
    font-size: .82rem;
    font-weight: 700;
    margin-bottom: 6px;
}

.dashboard-page .message-content,
.dashboard-page .message-content a {
    color: var(--dashboard-ink);
    font-size: .88rem;
    line-height: 1.55;
}

.ticket-page {
    max-width: 1160px;
}

.ticket-page > .row > .col-12 > h3 {
    font-size: clamp(1.25rem, 2.4vw, 2rem);
    line-height: 1.25;
    max-width: 1080px;
}

.ticket-page .chat-container {
    background: transparent;
    border: 0;
    max-width: 940px;
    padding: 0 0 80px;
}

.ticket-page .message {
    background: #fff;
    border: 1px solid var(--dashboard-line);
    border-left: 3px solid var(--dashboard-mint-dark);
    border-radius: 8px;
    margin: 0 0 14px;
    padding: 18px 20px 20px;
    text-align: left;
}

.ticket-page .message-author {
    align-items: center;
    color: var(--dashboard-coral) !important;
    display: flex;
    font-family: "Space Grotesk", sans-serif;
    font-size: .78rem;
    letter-spacing: .02em;
    margin-bottom: 10px;
}

.ticket-page .message-content {
    background: #f4f7f5;
    border: 1px solid var(--dashboard-line);
    border-radius: 6px;
    color: var(--dashboard-ink) !important;
    font-size: .88rem;
    line-height: 1.6;
    max-width: none;
    overflow-wrap: anywhere;
    padding: 14px 16px;
    width: 100%;
}

.ticket-page .message-content img,
.ticket-page .message-content video,
.ticket-page .message-content iframe {
    border-radius: 5px;
    max-width: 100%;
}

.ticket-page .message-content pre {
    background: #16202a;
    border-radius: 5px;
    color: #e8f5f1;
    max-width: 100%;
    overflow-x: auto;
    padding: 12px;
    white-space: pre-wrap;
}

.ticket-page .message-content code {
    background: #e7f5f0;
    border-radius: 3px;
    color: var(--dashboard-mint-dark);
    padding: 2px 5px;
}

.ticket-page .mention {
    background: #e7f5f0;
    border-radius: 3px;
    color: var(--dashboard-mint-dark) !important;
    cursor: pointer;
    font-weight: 700;
    padding: 2px 4px;
}

.ticket-page .mention:focus-visible {
    outline: 2px solid var(--dashboard-coral);
    outline-offset: 2px;
}

.ticket-page .embed-container {
    max-width: 100%;
    overflow-wrap: anywhere;
    overflow-x: auto;
}

body.dark-mode .ticket-page .message {
    background: #1c2730;
    border-color: #3a454b;
    border-left-color: var(--dashboard-mint-dark);
}

body.dark-mode .ticket-page .message-content {
    background: #202d36;
    border-color: #3a454b;
    color: #f2f5f4 !important;
}

body.dark-mode .ticket-page .message-content code,
body.dark-mode .ticket-page .mention {
    background: #23433e;
    color: #9bd8c6 !important;
}

@media (max-width: 760px) {
    .ticket-page .chat-container { padding-bottom: 50px; }
    .ticket-page .message { padding: 14px; }
    .ticket-page .message-content { padding: 12px; }
}

body.dark-mode:has(.dashboard-page) {
    background: var(--dashboard-paper) !important;
}

body.dark-mode .dashboard-page .table,
body.dark-mode .dashboard-page .table tbody tr,
body.dark-mode .dashboard-page .dashboard .card,
body.dark-mode .dashboard-page > .row > .col-12 > .card,
body.dark-mode .dashboard-page section > .card,
body.dark-mode .dashboard-page .section-card,
body.dark-mode .dashboard-page .chat-container {
    background: #1c2730 !important;
    border-color: var(--dashboard-line) !important;
}

body.dark-mode .dashboard-page .table thead,
body.dark-mode .dashboard-page .table thead th {
    background: #18232c !important;
    box-shadow: inset 0 0 0 9999px #18232c !important;
    color: #f2f5f4 !important;
}

body.dark-mode .dashboard-page .table tbody tr:hover,
body.dark-mode .dashboard-page .message {
    background: #26343e !important;
}

body.dark-mode .dashboard-page .table td,
body.dark-mode .dashboard-page .dashboard .card-title,
body.dark-mode .dashboard-page .dashboard .card-text,
body.dark-mode .dashboard-page .message-content,
body.dark-mode .dashboard-page .message-content a,
body.dark-mode .dashboard-page .section-card-body .form-control,
body.dark-mode .dashboard-page .section-card-body textarea {
    color: #f2f5f4 !important;
}

body.dark-mode .dashboard-page .dashboard .card-text,
body.dark-mode .dashboard-page p,
body.dark-mode .dashboard-page label,
body.dark-mode .dashboard-page small,
body.dark-mode .dashboard-page .text-muted {
    color: var(--dashboard-muted) !important;
}

body.dark-mode .dashboard-page .input-group .form-control,
body.dark-mode .dashboard-page .section-card-body .form-control,
body.dark-mode .dashboard-page .section-card-body textarea {
    background: #151c21;
    border-color: var(--dashboard-line);
}

body.dark-mode .dashboard-page .settings-section > .card {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

body.dark-mode .dashboard-page .settings-section > .card > .card-body {
    background: transparent !important;
}

body.dark-mode .dashboard-page .section-card {
    background: #1c2730 !important;
    border-color: #3a454b !important;
    border-left-color: var(--dashboard-coral) !important;
    box-shadow: 0 12px 28px rgba(0, 0, 0, .14);
}

body.dark-mode .dashboard-page .section-card:hover {
    border-color: var(--dashboard-mint-dark) !important;
    border-left-color: var(--dashboard-mint-dark) !important;
    box-shadow: 0 16px 34px rgba(0, 0, 0, .2);
}

body.dark-mode .dashboard-page .section-card-header {
    background: #18232c !important;
    border-bottom-color: #334149;
}

body.dark-mode .dashboard-page .section-card-body label {
    color: #f2f5f4 !important;
}

body.dark-mode .dashboard-page .rules-settings-card .rules-options-warning {
    background: rgba(240, 185, 76, .12);
    border-color: rgba(240, 185, 76, .4);
    color: #ffda91;
}

@media (max-width: 900px) {
    .dashboard-page .dashboard > .row { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 620px) {
    .dashboard-page { padding: 24px 16px 70px; }
    .dashboard-page .dashboard > .row { grid-template-columns: 1fr; }
    .dashboard-page .input-group { align-items: stretch; flex-direction: column; }
    .dashboard-page .input-group .form-control { width: 100% !important; }
    .dashboard-page .table { display: block; overflow-x: auto; white-space: nowrap; }
    .dashboard-page .chat-container { margin-left: -8px; margin-right: -8px; padding: 14px; }
    .dashboard-page .rules-settings-card .rules-fields { grid-template-columns: 1fr; }
    .dashboard-page .rules-settings-card .rules-text-group { grid-column: auto; }
    .dashboard-page .rules-settings-card .rules-text-meta { align-items: flex-start; flex-direction: column; gap: 4px; }
    .dashboard-page .rules-editor-grid { grid-template-columns: 1fr; }
    .dashboard-page .rules-editor .input-icon-field textarea { min-height: 220px; }
    .dashboard-page .rules-discord-preview { min-height: 220px; padding: 12px; }
}

body:has(.dashboard-page) .profile-modal-content {
    background: #232428 !important;
    border: 0;
    border-radius: 10px;
    box-shadow: 0 24px 70px rgba(0, 0, 0, .34);
    max-width: 500px;
    overflow: hidden;
}

.dashboard-page .settings-tabs {
    border-bottom: 1px solid var(--dashboard-line);
    display: flex;
    gap: 8px;
    margin-bottom: 22px;
    overflow-x: auto;
}

.dashboard-page .settings-tab-button {
    align-items: center;
    background: transparent;
    border: 0;
    border-bottom: 3px solid transparent;
    color: var(--dashboard-muted);
    display: inline-flex;
    flex: 0 0 auto;
    font-weight: 600;
    gap: 9px;
    padding: 12px 16px;
    transition: background .2s ease, color .2s ease, border-color .2s ease;
}

.dashboard-page .settings-tab-button:hover,
.dashboard-page .settings-tab-button.is-active {
    background: rgba(155, 216, 198, .12);
    border-bottom-color: var(--dashboard-coral);
    color: var(--dashboard-ink);
}

.dashboard-page .settings-tab-button:focus-visible {
    outline: 2px solid var(--dashboard-mint-dark);
    outline-offset: -2px;
}

.dashboard-page .settings-tab-button svg {
    height: 17px;
    width: 17px;
}

.dashboard-page .settings-tab-panel[hidden] {
    display: none !important;
}

.dashboard-page .settings-section [hidden] {
    display: none !important;
}

.dashboard-page .settings-card-grid[data-settings-layout="stacked"] > [data-settings-column] {
    flex: 0 0 100%;
    max-width: 100%;
    width: 100%;
}

.dashboard-page .settings-form-actions {
    display: flex;
    gap: 10px;
    justify-content: flex-end;
    margin: 18px 0 8px;
}

.dashboard-page .content-filter-description {
    color: var(--dashboard-muted);
    font-size: .9rem;
    line-height: 1.5;
}

.dashboard-page .content-filter-card textarea {
    min-height: 190px;
    resize: vertical;
}

.dashboard-page .spam-protection-fields {
    display: grid;
    gap: 0 20px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.dark-mode .dashboard-page .settings-tab-button:hover,
body.dark-mode .dashboard-page .settings-tab-button.is-active {
    background: rgba(155, 216, 198, .1);
    color: #f2f5f4;
}

@media (max-width: 620px) {
    .dashboard-page .spam-protection-fields {
        grid-template-columns: 1fr;
    }
}

body:has(.dashboard-page) .profile-modal-content .modal-close-floating {
    align-items: center;
    background: rgba(30, 31, 34, .78) !important;
    border: 0;
    border-radius: 50%;
    color: #fff;
    display: flex !important;
    height: 40px;
    justify-content: center;
    padding: 0;
    position: absolute;
    right: 14px;
    top: 14px;
    width: 40px;
    z-index: 3;
}

body:has(.dashboard-page) .profile-modal-content .modal-close-floating:hover {
    background: rgba(88, 101, 242, .95) !important;
    transform: scale(1.05);
}

body:has(.dashboard-page) .profile-modal-content .card {
    background: #232428 !important;
    border: 0;
    border-radius: 8px;
    box-shadow: none;
    overflow: hidden;
    position: relative;
    width: 100%;
}

body:has(.dashboard-page) .profile-modal-content .card-header {
    background: #1e1f22 !important;
    border: 0;
    height: 132px;
    padding: 0;
}

body:has(.dashboard-page) .profile-modal-content .card-header .banner,
body:has(.dashboard-page) .profile-modal-content .card-header .banner-img {
    background-color: #5865f2 !important;
    background-position: center;
    background-size: cover !important;
    border-radius: 0;
    height: 100%;
    width: 100%;
}

body:has(.dashboard-page) .profile-modal-content .card-body {
    background: #232428 !important;
    padding: 0;
    position: static;
}

body:has(.dashboard-page) .profile-modal-content .profile-header {
    align-items: flex-end;
    bottom: auto;
    display: flex;
    height: 94px;
    justify-content: space-between;
    left: 22px;
    position: absolute;
    right: 22px;
    top: 84px;
    width: auto;
    z-index: 2;
}

body:has(.dashboard-page) .profile-modal-content .profile-header .profil-logo {
    background: #232428;
    border: 7px solid #232428;
    border-radius: 50%;
    height: 102px;
    width: 102px;
}

body:has(.dashboard-page) .profile-modal-content .profile-header .profil-logo img {
    border-radius: 50%;
    height: 88px;
    object-fit: cover;
    width: 88px;
}

body:has(.dashboard-page) .profile-modal-content .profile-body {
    background: #2b2d31 !important;
    border-radius: 0;
    margin: 0;
    padding: 58px 26px 26px;
}

body:has(.dashboard-page) .profile-modal-content .profile-body .username {
    color: #fff !important;
    font-family: "Space Grotesk", sans-serif;
    font-size: 1.65rem;
    font-weight: 700;
    line-height: 1.15;
    margin: 0 0 6px;
}

body:has(.dashboard-page) .profile-modal-content .profile-body hr { display: none; }

body:has(.dashboard-page) .profile-modal-content .profile-body .basic-infos,
body:has(.dashboard-page) .profile-modal-content .profile-body .roles,
body:has(.dashboard-page) .profile-modal-content .note,
body:has(.dashboard-page) .profile-modal-content .message {
    border-top: 1px solid #3f4147;
    margin: 18px 0 0;
    padding: 18px 0 0;
}

body:has(.dashboard-page) .profile-modal-content .profile-body .basic-infos:first-of-type { margin-top: 0; }

body:has(.dashboard-page) .profile-modal-content .profile-body .category-title {
    color: #b5bac1 !important;
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .08em;
    margin-bottom: 8px;
    text-transform: uppercase;
}

body:has(.dashboard-page) .profile-modal-content .profile-body p {
    color: #dbdee1 !important;
    font-size: .86rem;
    line-height: 1.65;
    margin: 0;
}

body:has(.dashboard-page) .profile-modal-content .roles-list {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

body:has(.dashboard-page) .profile-modal-content .roles-list .role {
    align-items: center;
    background: #1e1f22;
    border: 1px solid #40434a;
    border-radius: 4px;
    color: #dbdee1 !important;
    display: inline-flex;
    font-size: .75rem;
    gap: 6px;
    margin: 0;
    padding: 5px 8px;
}

body:has(.dashboard-page) .profile-modal-content .roles-list .role .role-color {
    border-radius: 50%;
    height: 8px;
    width: 8px;
}

body:has(.dashboard-page) .profile-modal-content .note textarea,
body:has(.dashboard-page) .profile-modal-content .message input {
    background: #1e1f22 !important;
    border: 1px solid #1e1f22;
    border-radius: 4px;
    color: #dbdee1 !important;
    font-size: .82rem;
    margin: 4px 0 0;
    padding: 11px 12px;
    width: 100%;
}

body:has(.dashboard-page) .profile-modal-content .note textarea {
    min-height: 72px;
    resize: vertical;
}

body:has(.dashboard-page) .profile-modal-content .note textarea::placeholder,
body:has(.dashboard-page) .profile-modal-content .message input::placeholder {
    color: #949ba4;
}

body:has(.dashboard-page) .profile-modal-content .note textarea:focus,
body:has(.dashboard-page) .profile-modal-content .message input:focus {
    border-color: #5865f2;
    box-shadow: 0 0 0 2px rgba(88, 101, 242, .25);
    outline: 0;
}

body:has(.dashboard-page) .modal-backdrop { background: #101a22; }
body:has(.dashboard-page) .modal-backdrop.show { opacity: .78; }

body.dark-mode:has(.dashboard-page) .profile-modal-content .card,
body.dark-mode:has(.dashboard-page) .profile-modal-content .card-body,
body.dark-mode:has(.dashboard-page) .profile-modal-content .profile-body { background: #20262b !important; }

body.dark-mode:has(.dashboard-page) .profile-modal-content .profile-body .basic-infos,
body.dark-mode:has(.dashboard-page) .profile-modal-content .profile-body .roles,
body.dark-mode:has(.dashboard-page) .profile-modal-content .note,
body.dark-mode:has(.dashboard-page) .profile-modal-content .message { border-color: #3a454b; }

body:has(.dashboard-page) .dashboard-page table.dashboard-table > thead > tr > th {
    background-color: #16202a !important;
    box-shadow: inset 0 0 0 9999px #16202a !important;
    color: #e8f5f1 !important;
}
body.dark-mode .members-panel .table thead,
body.dark-mode .forms-content .table thead { background: #18232c !important; color: #f2f5f4 !important; }
body.dark-mode .members-panel .table thead th,
body.dark-mode .members-panel .table thead h5,
body.dark-mode .forms-content .table thead th { color: #f2f5f4 !important; }
body.dark-mode .dashboard-icon-button { background: #2b3942; color: #f2f5f4; }
body.dark-mode .dashboard-icon-button:hover { background: var(--dashboard-coral); color: #fff; }
body.dark-mode .dashboard-nav,
body.dark-mode:has(.dashboard-shell) .dashboard-nav,
body.dark-mode:has(.server-dashboard) .dashboard-nav { background: #18232c !important; border-bottom-color: #334149 !important; }
body.dark-mode .dashboard-nav .nav-list a { color: #b8c9c7 !important; }
body.dark-mode .dashboard-nav .brand-link,
body.dark-mode .dashboard-nav .brand-mark { color: #f7fbf8 !important; }
body.dark-mode .dashboard-nav .nav-actions a.nav-current { color: #fff !important; }

.ticket-page .chat-container,
body.dark-mode .ticket-page .chat-container {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    max-width: 980px;
    padding: 0 0 80px;
}

.ticket-page .message,
body.dark-mode .ticket-page .message {
    background: transparent !important;
    border: 0 !important;
    border-left: 3px solid var(--dashboard-mint-dark) !important;
    border-radius: 0;
    margin: 0 0 24px;
    padding: 0 0 0 18px;
}

.ticket-page .message-author {
    margin: 0 0 8px;
    padding: 0;
}

.ticket-page .message-content,
body.dark-mode .ticket-page .message-content {
    background: #1c2730 !important;
    border: 1px solid var(--dashboard-line);
    border-radius: 7px;
    color: #f2f5f4 !important;
    max-width: none;
    padding: 16px 18px;
}

.ticket-page .message-content[style*="transparent"] {
    background: transparent !important;
    border: 0;
    padding: 0;
}

.ticket-page .embed-container {
    border-radius: 6px;
    max-width: 100%;
}

/* Custom slash command management */
.custom-commands-page {
    --custom-command-surface: #fff;
    --custom-command-input: #f4f7f5;
    --custom-command-border: var(--dashboard-line);
    --custom-command-text: var(--dashboard-ink);
    --custom-command-muted: var(--dashboard-muted);
}

.custom-commands-hero {
    min-height: 220px;
    padding: 34px 42px;
}

.custom-command-hero-icon {
    align-items: center;
    border-radius: 18px;
    display: flex;
    flex: 0 0 76px;
    font-size: 1.8rem;
    height: 76px;
    justify-content: center;
    width: 76px;
}

.custom-command-hero-copy { position: relative; z-index: 1; }
.custom-command-hero-copy h1 { margin: 8px 0; }
.custom-command-hero-copy p { color: #b8c9c7 !important; margin: 0; }
.custom-command-hero-copy strong { color: #f7fbf8 !important; }

.custom-command-total {
    align-items: center;
    background: rgba(255, 255, 255, .08);
    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 8px;
    color: #f7fbf8;
    display: flex;
    flex-direction: column;
    min-width: 100px;
    padding: 12px 18px;
    position: relative;
    z-index: 1;
}

.custom-command-total span { color: #b8c9c7 !important; font-size: .62rem; font-weight: 700; letter-spacing: .12em; }
.custom-command-total strong { color: #f7fbf8 !important; font-family: "Space Grotesk", sans-serif; font-size: 1.8rem; line-height: 1.1; }
.custom-command-total small { color: #b8c9c7 !important; font-size: .7rem; }

.custom-command-intro {
    align-items: center;
    display: flex;
    justify-content: space-between;
    margin: 0 0 24px;
}

.custom-command-intro h2 {
    font-family: "Space Grotesk", sans-serif;
    font-size: clamp(1.4rem, 3vw, 1.9rem);
    letter-spacing: -.035em;
    margin: 8px 0 5px;
}

.custom-command-intro p { color: var(--custom-command-muted) !important; margin: 0; max-width: 650px; }
.custom-command-notice {
    align-items: center;
    border: 1px solid transparent;
    border-radius: 6px;
    display: flex;
    font-size: .86rem;
    gap: 10px;
    margin: 0 0 18px;
    padding: 12px 16px;
}

.custom-command-notice i { font-size: 1rem; }
.custom-command-notice-success { background: #e7f5f0; border-color: #c7e7dc; color: #216c5a; }
.custom-command-notice-warning { background: #fff4df; border-color: #f3dfb6; color: #805a1f; }
.custom-command-notice-error { background: #fbe9e7; border-color: #edc9c4; color: #9d3e3a; }

.custom-commands-grid {
    align-items: start;
    display: grid;
    gap: 18px;
    grid-template-columns: minmax(300px, .88fr) minmax(0, 1.12fr);
}

.custom-command-panel {
    background: var(--custom-command-surface);
    border: 1px solid var(--custom-command-border);
    border-radius: 8px;
    min-width: 0;
    padding: 24px;
}

.custom-command-panel-heading { align-items: center; display: flex; gap: 13px; margin-bottom: 10px; }
.custom-command-panel-heading .dashboard-kicker { color: var(--dashboard-coral); font-size: .62rem; }
.custom-command-panel-heading h2 { font-family: "Space Grotesk", sans-serif; font-size: 1.28rem; margin: 3px 0 0; }
.custom-command-panel-icon { align-items: center; border-radius: 8px; display: flex; flex: 0 0 42px; height: 42px; justify-content: center; }
.custom-command-panel-icon-coral { background: #fff0ec; color: var(--dashboard-coral); }
.custom-command-panel-copy { color: var(--custom-command-muted) !important; font-size: .82rem; line-height: 1.5; margin: 0 0 22px; }
.custom-command-list-heading { justify-content: space-between; margin-bottom: 20px; }
.custom-command-count { background: #e7f5f0; border-radius: 20px; color: #277c70 !important; font-size: .72rem; font-weight: 700; padding: 6px 10px; white-space: nowrap; }

.custom-command-field { margin: 0 0 17px; }
.custom-command-field label { color: var(--custom-command-text) !important; display: block; font-size: .78rem; font-weight: 700; margin: 0 0 7px; }
.custom-command-field small { color: var(--custom-command-muted) !important; display: block; font-size: .69rem; line-height: 1.4; margin-top: 6px; }
.custom-command-name-input { align-items: stretch; display: flex; }
.custom-command-name-input > span { align-items: center; background: #fff0ec; border: 1px solid #f2c6ba; border-radius: 5px 0 0 5px; color: #a94d3c !important; display: flex; font-family: "Space Grotesk", sans-serif; font-size: 1.05rem; font-weight: 700; justify-content: center; width: 42px; }
.custom-command-name-input .form-control { border-bottom-left-radius: 0; border-top-left-radius: 0; }
.custom-command-field .form-control {
    background: var(--custom-command-input) !important;
    border: 1px solid var(--custom-command-border);
    border-radius: 5px;
    color: var(--custom-command-text) !important;
    font-family: "DM Sans", sans-serif;
    font-size: .84rem;
    min-height: 44px;
    padding: 10px 12px;
}

.custom-command-field textarea.form-control { min-height: 138px; resize: vertical; }
.custom-command-field .form-control::placeholder { color: #899697; opacity: 1; }
.custom-command-field .form-control:focus { border-color: var(--dashboard-coral); box-shadow: 0 0 0 3px rgba(238, 118, 93, .16); }
.custom-command-ephemeral-option .custom-command-ephemeral-label { align-items: center; cursor: pointer; display: flex; gap: 9px; margin: 0; }
.custom-command-ephemeral-checkbox { accent-color: var(--dashboard-coral); flex: 0 0 auto; height: 16px; margin: 0; width: 16px; }
.custom-command-ephemeral-option small { margin-top: 7px; }

.custom-command-submit {
    align-items: center;
    background: var(--dashboard-coral);
    border: 0;
    border-radius: 5px;
    color: #16202a;
    display: inline-flex;
    font-size: .78rem;
    font-weight: 700;
    gap: 8px;
    justify-content: center;
    min-height: 42px;
    padding: 0 16px;
    transition: background .2s ease, transform .2s ease;
}

.custom-command-submit:hover { background: #df6b55; transform: translateY(-1px); }
.custom-command-submit:focus-visible,
.custom-command-delete:focus-visible,
.custom-command-sync button:focus-visible { outline: 3px solid rgba(238, 118, 93, .45); outline-offset: 2px; }

.custom-command-items { display: grid; gap: 11px; }
.custom-command-item { background: var(--custom-command-input); border: 1px solid var(--custom-command-border); border-radius: 7px; padding: 15px 16px 0; }
.custom-command-item-heading { align-items: center; display: flex; flex-wrap: wrap; gap: 8px; justify-content: space-between; }
.custom-command-name { align-items: center; background: #18232c; border-radius: 5px; color: #f7fbf8; display: inline-flex; font-family: "Space Grotesk", sans-serif; font-size: .9rem; gap: 5px; padding: 6px 10px; }
.custom-command-name span { color: var(--dashboard-coral) !important; font-weight: 700; }
.custom-command-name strong { color: #f7fbf8 !important; }
.custom-command-scope { align-items: center; color: var(--custom-command-muted) !important; display: inline-flex; font-size: .68rem; gap: 5px; }
.custom-command-scope i { color: var(--dashboard-mint-dark); }
.custom-command-visibility { align-items: center; background: #e7f5f0; border-radius: 20px; color: #277c70 !important; display: inline-flex; font-size: .67rem; gap: 5px; padding: 5px 9px; }
.custom-command-visibility i { color: var(--dashboard-coral); }
.custom-command-description { color: var(--custom-command-muted) !important; font-size: .8rem; margin: 9px 0 12px; }
.custom-command-preview { border-left: 2px solid var(--dashboard-mint-dark); margin: 0 0 12px; padding: 1px 0 1px 11px; }
.custom-command-preview span { color: var(--custom-command-muted) !important; display: block; font-size: .57rem; font-weight: 700; letter-spacing: .1em; margin-bottom: 4px; }
.custom-command-preview p { color: var(--custom-command-text) !important; font-size: .76rem; line-height: 1.45; margin: 0; overflow-wrap: anywhere; white-space: pre-wrap; }

.custom-command-edit { border-top: 1px solid var(--custom-command-border); }
.custom-command-edit summary { align-items: center; color: var(--custom-command-muted); cursor: pointer; display: flex; font-size: .75rem; font-weight: 700; gap: 7px; list-style: none; min-height: 42px; }
.custom-command-edit summary::-webkit-details-marker { display: none; }
.custom-command-edit summary::after { color: var(--dashboard-coral); content: "+"; font-size: 1.1rem; margin-left: auto; }
.custom-command-edit[open] summary::after { content: "-"; }
.custom-command-edit summary:hover { color: var(--dashboard-ink); }
.custom-command-edit-content { border-top: 1px solid var(--custom-command-border); padding: 15px 0 16px; }
.custom-command-edit-content .custom-command-field textarea.form-control { min-height: 110px; }
.custom-command-delete-form { margin-top: 10px; }
.custom-command-delete { background: transparent; border: 1px solid #d99a93; border-radius: 5px; color: #a94752; font-size: .73rem; font-weight: 700; min-height: 36px; padding: 0 11px; }
.custom-command-delete:hover { background: #fbe9e7; }

.custom-command-empty { align-items: center; border: 1px dashed #b9ccc7; border-radius: 7px; display: flex; flex-direction: column; padding: 34px 20px; text-align: center; }
.custom-command-empty-icon { align-items: center; background: #e7f5f0; border-radius: 50%; color: var(--dashboard-mint-dark); display: flex; font-size: 1.25rem; height: 46px; justify-content: center; margin-bottom: 12px; width: 46px; }
.custom-command-empty h3 { font-family: "Space Grotesk", sans-serif; font-size: 1rem; margin: 0 0 5px; }
.custom-command-empty p { color: var(--custom-command-muted) !important; font-size: .77rem; margin: 0; max-width: 280px; }
.custom-command-empty code { color: #a94d3c; }

.custom-command-sync {
    align-items: center;
    background: #18232c;
    border-radius: 7px;
    color: #f7fbf8;
    display: flex;
    justify-content: space-between;
    margin-top: 18px;
    padding: 14px 18px;
}

.custom-command-sync > div { align-items: center; display: flex; gap: 12px; }
.custom-command-sync > div > i { color: var(--dashboard-mint); font-size: 1.2rem; }
.custom-command-sync p { display: flex; flex-direction: column; margin: 0; }
.custom-command-sync p strong { color: #f7fbf8 !important; font-size: .78rem; }
.custom-command-sync p span { color: #b8c9c7 !important; font-size: .69rem; margin-top: 2px; }
.custom-command-sync button { background: transparent; border: 1px solid rgba(255, 255, 255, .25); border-radius: 5px; color: #f7fbf8; font-size: .7rem; font-weight: 700; min-height: 36px; padding: 0 11px; }
.custom-command-sync button:hover { background: rgba(255, 255, 255, .1); }
.custom-command-sync button i { color: var(--dashboard-coral); margin-left: 4px; }

body.dark-mode .custom-commands-page {
    --custom-command-surface: #1c2730;
    --custom-command-input: #202d36;
    --custom-command-border: #3a454b;
    --custom-command-text: #f2f5f4;
    --custom-command-muted: #a8b5b5;
}

body.dark-mode .custom-command-panel { background: var(--custom-command-surface); border-color: var(--custom-command-border); }
body.dark-mode .custom-command-item { background: var(--custom-command-input); border-color: var(--custom-command-border); }
body.dark-mode .custom-command-name-input > span { background: #3a2929; border-color: #70433d; color: #ffb3a3 !important; }
body.dark-mode .custom-command-count { background: #23433e; color: #9bd8c6 !important; }
body.dark-mode .custom-command-visibility { background: #23433e; color: #9bd8c6 !important; }
body.dark-mode .custom-command-empty { border-color: #465b5b; }
body.dark-mode .custom-command-empty-icon { background: #23433e; }
body.dark-mode .custom-command-notice-success { background: #1d3834; border-color: #31584f; color: #a9e0cc; }
body.dark-mode .custom-command-notice-warning { background: #3a3325; border-color: #655637; color: #f4d294; }
body.dark-mode .custom-command-notice-error { background: #3a2929; border-color: #70433d; color: #ffb3a3; }
body.dark-mode .custom-command-delete { border-color: #83514e; color: #ffb3a3; }
body.dark-mode .custom-command-delete:hover { background: #3a2929; }

@media (max-width: 900px) {
    .custom-commands-grid { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 620px) {
    .custom-commands-hero { align-items: flex-start; flex-direction: column; gap: 18px; padding: 28px 22px; }
    .custom-commands-hero::after { display: none; }
    .custom-commands-hero .server-identity { align-items: flex-start; gap: 13px; }
    .custom-command-hero-icon { border-radius: 12px; flex-basis: 48px; font-size: 1.2rem; height: 48px; width: 48px; }
    .custom-command-hero-copy h1 { font-size: clamp(1.55rem, 7vw, 2rem); }
    .custom-command-total { align-self: flex-end; min-width: 66px; padding: 8px 10px; }
    .custom-command-total strong { font-size: 1.4rem; }
    .custom-command-intro { align-items: flex-start; flex-direction: column; gap: 14px; }
    .custom-command-panel { padding: 19px 16px; }
    .custom-command-sync { align-items: flex-start; flex-direction: column; gap: 14px; }
    .custom-command-sync form { width: 100%; }
    .custom-command-sync button { width: 100%; }
}

body:has(.custom-commands-page) .custom-command-hero-copy p,
body:has(.custom-commands-page) .custom-command-intro p,
body:has(.custom-commands-page) .custom-command-panel-copy,
body:has(.custom-commands-page) .custom-command-scope,
body:has(.custom-commands-page) .custom-command-description,
body:has(.custom-commands-page) .custom-command-preview span,
body:has(.custom-commands-page) .custom-command-preview p,
body:has(.custom-commands-page) .custom-command-empty p,
body:has(.custom-commands-page) .custom-command-sync p span {
    color: var(--custom-command-muted) !important;
}

body:has(.custom-commands-page) .custom-command-hero-copy strong,
body:has(.custom-commands-page) .custom-command-total span,
body:has(.custom-commands-page) .custom-command-total strong,
body:has(.custom-commands-page) .custom-command-total small,
body:has(.custom-commands-page) .custom-command-sync p strong {
    color: #f7fbf8 !important;
}

body:has(.custom-commands-page) .custom-command-notice span { color: inherit !important; }
body:has(.custom-commands-page) .custom-command-name span { color: var(--dashboard-coral) !important; }
body:has(.custom-commands-page) .custom-command-name strong { color: #f7fbf8 !important; }
body:has(.custom-commands-page) .custom-command-count { color: #277c70 !important; }
body:has(.custom-commands-page) .custom-command-visibility { color: #277c70 !important; }
body.dark-mode:has(.custom-commands-page) .custom-command-count { color: #9bd8c6 !important; }
body.dark-mode:has(.custom-commands-page) .custom-command-visibility { color: #9bd8c6 !important; }

/* Shared layout for the legacy server-management views */
.management-view {
    margin: 0 auto !important;
    max-width: 1220px !important;
    padding: 28px 24px 110px !important;
    text-align: left !important;
    width: 100% !important;
}

.management-page-hero {
    margin-bottom: 32px;
}

.management-page-hero .dashboard-kicker {
    color: var(--dashboard-mint) !important;
}

.management-page-hero h1 {
    color: #f7fbf8 !important;
}

.management-page-hero p {
    color: #b8c9c7 !important;
    line-height: 1.55;
    max-width: 720px;
}

.management-hero-icon {
    border-radius: 16px;
    flex: 0 0 72px;
    font-size: 1.8rem;
    height: 72px;
    width: 72px;
}

.management-hero-mark {
    color: rgba(255, 255, 255, .13);
    font-size: 6rem;
    position: relative;
    z-index: 1;
}

.management-hero-back {
    background: rgba(155, 216, 198, .12);
    border-radius: 5px;
    padding: 11px 14px;
}

.management-view > .row {
    margin-left: 0;
    margin-right: 0;
}

.management-view > .row > [class*="col-"] {
    padding-left: 0;
    padding-right: 0;
}

.management-view > .row > .col-12 > p {
    color: var(--dashboard-muted) !important;
    margin-bottom: 18px;
}

.management-view .input-group {
    margin-bottom: 18px !important;
}

.management-view .form-control,
.management-view .form-select {
    background-color: #fff;
    border-color: var(--dashboard-line);
    border-radius: 5px;
    color: var(--dashboard-ink);
    min-height: 42px;
}

.management-view .form-control:focus,
.management-view .form-select:focus {
    border-color: var(--dashboard-mint-dark);
    box-shadow: 0 0 0 .2rem rgba(39, 124, 112, .14);
}

.management-view .btn {
    border-radius: 5px;
    font-weight: 600;
}

.management-view .table {
    background: #fff;
    border: 1px solid var(--dashboard-line);
    border-radius: 8px;
    color: var(--dashboard-ink);
    margin-top: 0 !important;
    overflow: hidden;
    vertical-align: middle;
}

.management-view .table thead {
    background: var(--dashboard-ink);
    color: #e8f5f1;
}

.management-view .table thead th {
    border: 0;
    color: #e8f5f1 !important;
    font-size: .7rem;
    font-weight: 700;
    padding: 14px 12px;
    text-transform: uppercase;
    white-space: nowrap;
}

.management-view .table tbody tr {
    background: #fff;
    border-color: #edf1ef;
}

.management-view .table tbody tr:hover {
    background: #f0f7f4;
}

.management-view .table td {
    border-color: #edf1ef;
    color: var(--dashboard-ink) !important;
    font-size: .8rem;
    padding: 12px;
    vertical-align: middle;
}

.management-overview .dashboard > .row {
    row-gap: 6px;
}

.management-overview .dashboard .card {
    background: #fff !important;
    border: 1px solid var(--dashboard-line);
    border-left: 3px solid var(--dashboard-coral);
    border-radius: 8px !important;
    color: var(--dashboard-ink) !important;
    height: calc(100% - 1rem);
    padding: 20px !important;
}

.management-overview .dashboard .card:nth-child(even) {
    border-left-color: var(--dashboard-mint-dark);
}

.management-overview .dashboard .card-header {
    background: transparent;
    border: 0;
    color: var(--dashboard-muted);
    padding: 0;
}

.management-overview .dashboard .card-header h5 {
    font-size: .8rem;
    font-weight: 700;
    margin: 0;
}

.management-overview .dashboard .card-body {
    padding: 18px 0 0;
}

.management-overview .dashboard .card-title {
    color: var(--dashboard-ink) !important;
    font-family: "Space Grotesk", sans-serif;
    font-size: 2rem;
    margin-bottom: 6px;
}

.management-overview .dashboard .card-text {
    color: var(--dashboard-muted) !important;
    font-size: .8rem;
    margin: 0;
}

.management-forms .table .btn {
    margin: 2px;
}

.management-settings .settings-section > p {
    color: var(--dashboard-muted) !important;
    margin-bottom: 20px;
}

.management-settings .section-card {
    background: #fff;
    border-color: var(--dashboard-line);
    border-radius: 8px;
}

.management-settings .section-card-header {
    border-color: var(--dashboard-line);
}

.management-settings .section-card-header h5 {
    color: var(--dashboard-ink);
    font-family: "Space Grotesk", sans-serif;
}

.management-ticket-detail .chat-container {
    margin-top: 0;
}

body.dark-mode .management-view .form-control,
body.dark-mode .management-view .form-select {
    background-color: #202d36;
    border-color: var(--dashboard-line);
    color: #f2f5f4;
}

body.dark-mode .management-view .table,
body.dark-mode .management-view .table tbody tr,
body.dark-mode .management-overview .dashboard .card,
body.dark-mode .management-settings .section-card {
    background: #1c2730 !important;
    border-color: var(--dashboard-line);
}

body.dark-mode .management-view .table thead {
    background: #16202a;
}

body.dark-mode .management-view .table tbody tr:hover {
    background: #26343e !important;
}

body.dark-mode .management-view .table td,
body.dark-mode .management-overview .dashboard .card-title,
body.dark-mode .management-overview .dashboard .card-header,
body.dark-mode .management-settings .section-card-header h5 {
    color: #f2f5f4 !important;
}

body.dark-mode .management-view .table td {
    border-color: #334149;
}

body.dark-mode .management-settings .section-card-header {
    border-color: var(--dashboard-line);
}

body.dark-mode .management-overview .dashboard .card {
    border-left-color: var(--dashboard-coral);
}

@media (max-width: 760px) {
    .management-view {
        padding: 24px 16px 80px !important;
    }

    .management-page-hero {
        align-items: flex-start;
        flex-direction: column;
        gap: 18px;
        padding: 28px 22px;
    }

    .management-page-hero::after {
        right: -150px;
    }

    .management-page-hero .server-identity {
        align-items: flex-start;
        gap: 14px;
    }

    .management-page-hero h1 {
        font-size: clamp(1.55rem, 7vw, 2rem);
    }

    .management-hero-icon {
        flex-basis: 52px;
        font-size: 1.25rem;
        height: 52px;
        width: 52px;
    }

    .management-hero-mark {
        bottom: 14px;
        font-size: 4.5rem;
        position: absolute;
        right: 18px;
    }

    .management-hero-back {
        align-self: flex-end;
    }

    .management-view .table {
        font-size: .72rem;
    }

    .management-view .table td,
    .management-view .table thead th {
        padding: 10px 8px;
    }
}