:root {
    --bg: #0d1117;
    --surface: #121821;
    --surface-2: #171f2b;
    --ink: #f8fbff;
    --muted: #99a8ba;
    --line: #242d39;
    --accent: #ff6a3d;
    --accent-2: #ffc155;
    --green: #1e8b60;
    --shadow: 0 22px 55px rgba(16, 12, 22, 0.08);
    --radius-xl: 28px;
    --radius-lg: 22px;
    --radius-md: 16px;
    --radius-sm: 12px;
    --container: 1240px;
}

.questboard-join-form {
    margin-top: 12px;
}

.questboard-join-button {
    width: 100%;
}

.showcase-card-link {
    display: grid;
    gap: 16px;
}

.showcase-join-form {
    margin-top: 12px;
}

.showcase-join-form .button {
    width: 100%;
    justify-content: center;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
    margin: 0;
    font-family: "Segoe UI", Arial, sans-serif;
    color: var(--ink);
    background:
        radial-gradient(circle at top left, rgba(255, 193, 85, 0.08), transparent 22%),
        radial-gradient(circle at top right, rgba(255, 106, 61, 0.08), transparent 18%),
        var(--bg);
}

body.page-campaigns {
    background: #1a1c1e;
}

body.page-launch-campaign {
    background: #1a1c1e;
}

body.page-launch-campaign .banner-panel {
    background: var(--surface);
}
a { color: inherit; text-decoration: none; }

.shell {
    width: min(var(--container), calc(100% - 32px));
    margin: 0 auto;
}

.topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 18px;
    padding: 22px 0;
}

.brand, .topnav, .top-actions, .tag-row, .card-row, .button-row, .section-head, .hero-actions, .metric-row, .leader-item {
    display: flex;
    align-items: center;
    gap: 12px;
}

.brand { font-weight: 800; }

.brand-logo {
    display: block;
    height: 42px;
    width: auto;
}

.brand-mark {
    width: 44px;
    height: 44px;
    display: grid;
    place-items: center;
    border-radius: 14px;
    font-weight: 900;
    color: #fff;
    background: linear-gradient(135deg, var(--accent), #ff845c);
}

.topnav a, .nav-user { color: var(--muted); font-weight: 700; }

.top-search {
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 1 1 320px;
    max-width: 420px;
}

.top-search-input {
    width: 100%;
    min-height: 46px;
    padding: 0 16px;
    border-radius: 14px;
    border: 1px solid var(--line);
    background: var(--surface-2);
    color: #fff;
}

.top-search-input::placeholder {
    color: var(--muted);
}

.top-search-button {
    flex: 0 0 auto;
}

.nav-user-link {
    text-decoration: none;
    transition: color .18s ease, opacity .18s ease;
}

.nav-user-link:hover,
.nav-user-link:focus-visible {
    color: #fff;
}

.button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 46px;
    padding: 0 18px;
    border-radius: 14px;
    border: 1px solid transparent;
    font-weight: 800;
    cursor: pointer;
}

.button-primary {
    background: linear-gradient(135deg, var(--accent), #ff845c);
    color: #fff;
    box-shadow: var(--shadow);
}

.button-secondary {
    background: transparent;
    border-color: #5f6773;
    color: #e8edf5;
}

.small-button {
    min-height: 34px;
    padding: 0 12px;
    font-size: .85rem;
}

.hero, .split-section, .dashboard, .admin-grid, .profile-layout {
    display: grid;
    gap: 20px;
}

.hero {
    grid-template-columns: 1.08fr 0.92fr;
    padding: 18px 0 28px;
}

.hero h1, .section-title, .banner h1, .auth-card h1 {
    margin: 0;
    line-height: 1.05;
}

.hero h1 { font-size: clamp(2.2rem, 4.1vw, 3.9rem); max-width: 11ch; }

.hero-copy, .banner-copy p, .info-card p, .quest-card p, .box p, .auth-card p, label {
    color: var(--muted);
    line-height: 1.65;
}

.eyebrow {
    margin: 0 0 10px;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    font-size: 0.78rem;
    font-weight: 900;
    color: var(--accent);
}

.metric-row { margin-top: 26px; flex-wrap: wrap; }
.metric-row > div, .hero-panel, .info-card, .box, .auth-card, .stat-card {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow);
}

.metric-row > div { flex: 1 1 180px; padding: 18px; }
.metric-row strong { display:block; font-size:1.45rem; margin-bottom:6px; }

.hero-panel, .banner-panel, .auth-card, .box, .info-card, .quest-card, .queue-card {
    padding: 22px;
}

.panel-head, .banner-panel, .queue, .quest-list, .menu, .plain-list, .leader-list {
    display: grid;
    gap: 14px;
}

.panel-card { margin-top: 6px; }

.mini-grid, .card-grid, .stat-grid, .form-grid {
    display: grid;
    gap: 16px;
}

.mini-grid { grid-template-columns: repeat(2, 1fr); margin-top: 18px; }
.mini-card {
    padding: 16px;
    border-radius: var(--radius-md);
    background: var(--surface-2);
    border: 1px solid var(--line);
    display: grid;
    gap: 6px;
}

.section { padding: 22px 0; }
.section-title { font-size: clamp(1.7rem, 3vw, 2.5rem); }
.section-head { justify-content: space-between; flex-wrap: wrap; margin-bottom: 18px; }

.home-filter-bar {
    display: flex;
    align-items: center;
    gap: 18px;
    flex-wrap: wrap;
    margin: 0 0 22px;
    padding: 10px 0 2px;
}

.home-filter-group {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.home-filter-group--categories {
    flex: 1 1 720px;
}

.home-filter-divider {
    width: 1px;
    height: 28px;
    background: rgba(255, 255, 255, 0.10);
    flex: 0 0 auto;
}

.home-filter-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    padding: 0 14px;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    background: rgba(255, 255, 255, 0.03);
    color: #dce4ee;
    font-size: 0.92rem;
    font-weight: 700;
    line-height: 1;
    transition: border-color .18s ease, background .18s ease, color .18s ease, transform .18s ease;
}

.home-filter-pill:hover,
.home-filter-pill:focus-visible,
.home-filter-more[open] > .home-filter-pill,
.home-filter-pill.is-active {
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.24);
    color: #fff;
    transform: translateY(-1px);
}

.home-filter-more {
    position: relative;
}

.home-filter-more summary {
    list-style: none;
    cursor: pointer;
}

.home-filter-more summary::-webkit-details-marker {
    display: none;
}

.home-filter-more__menu {
    position: absolute;
    top: calc(100% + 10px);
    right: 0;
    min-width: 220px;
    display: grid;
    gap: 4px;
    padding: 10px;
    border-radius: 18px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: #11161f;
    box-shadow: 0 22px 55px rgba(0, 0, 0, 0.28);
    z-index: 30;
}

.home-filter-more__item {
    display: block;
    padding: 10px 12px;
    border-radius: 12px;
    color: #cfd8e4;
    font-size: 0.92rem;
    font-weight: 600;
}

.home-filter-more__item:hover,
.home-filter-more__item:focus-visible,
.home-filter-more__item.is-active {
    background: rgba(255, 255, 255, 0.07);
    color: #fff;
}

.card-grid.two { grid-template-columns: repeat(2, 1fr); }
.card-grid.three { grid-template-columns: repeat(3, 1fr); }
.card-grid.five { grid-template-columns: repeat(5, 1fr); }
.info-card.compact { min-height: 150px; }

.pill, .tag, .status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    padding: 8px 12px;
    font-size: .82rem;
    font-weight: 800;
}

.pill { background: #2558ff; color: #fff; width: fit-content; }
.tag { background: var(--surface-2); border: 1px solid var(--line); color: #dfe7f1; }
.tag-active { background: rgba(30, 139, 96, .16); border-color: rgba(30, 139, 96, .34); color: #9be2ba; }
.status { background: rgba(30,139,96,.12); color: var(--green); width: fit-content; }

.split-section { grid-template-columns: 1fr 1fr; }
.split-panel {
    padding: 26px;
    border-radius: var(--radius-xl);
    background: var(--surface);
    border: 1px solid var(--line);
    box-shadow: var(--shadow);
}
.split-panel.accent { background: linear-gradient(135deg, rgba(255,106,61,.12), rgba(255,193,85,.12)); }

.featured-campaign-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 14px;
}

.featured-campaign-logo {
    width: 60px;
    height: 60px;
    border-radius: 20px;
    overflow: hidden;
    background:
        radial-gradient(circle at top left, rgba(255,255,255,.12), transparent 45%),
        linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02)),
        var(--surface-2);
    border: 1px solid rgba(255,255,255,.08);
    display: grid;
    place-items: center;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.06),
        0 14px 30px rgba(0,0,0,.20);
}

.featured-campaign-logo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.featured-campaign-logo.fallback {
    background: linear-gradient(135deg, rgba(255,106,61,.18), rgba(255,193,85,.18));
    color: #fff;
    font-weight: 900;
    font-size: 1.2rem;
}

.showcase-stack {
    display: grid;
    gap: 34px;
}

.showcase-section {
    display: grid;
    gap: 16px;
}

.showcase-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    color: #f4f7fb;
}

.showcase-head strong {
    font-size: 1.05rem;
}

.showcase-head span {
    color: var(--muted);
    font-size: .9rem;
    font-weight: 700;
}

.showcase-head a {
    color: var(--muted);
    font-size: .9rem;
    font-weight: 700;
    text-decoration: none;
    transition: color .18s ease;
}

.showcase-head a:hover,
.showcase-head a:focus-visible {
    color: #fff;
}

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

.campaign-directory-page {
    padding: 12px 0 0;
    border-radius: 0;
    background: transparent;
}

.showcase-card {
    min-width: 0;
    position: relative;
    overflow: hidden;
    padding: 22px;
    border-radius: 26px;
    background:
        radial-gradient(circle at top left, rgba(255,255,255,.07), transparent 36%),
        linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.015)),
        #121821;
    border: 1px solid rgba(255,255,255,.08);
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.05),
        0 18px 44px rgba(5, 8, 14, .22);
    display: grid;
    gap: 18px;
}

.showcase-card::after {
    content: "";
    position: absolute;
    inset: auto -20% -42% auto;
    width: 180px;
    height: 180px;
    border-radius: 999px;
    background: radial-gradient(circle, rgba(255,193,85,.10), transparent 70%);
    pointer-events: none;
}

.showcase-card-link {
    position: relative;
    z-index: 1;
    color: inherit;
    text-decoration: none;
    transition: transform .22s ease, filter .22s ease;
}

.showcase-card-link:hover,
.showcase-card-link:focus-visible {
    transform: translateY(-3px);
    filter: brightness(1.03);
}

.showcase-card-empty {
    place-content: center;
    min-height: 220px;
}

.showcase-brand {
    display: flex;
    align-items: center;
    gap: 14px;
    min-width: 0;
}

.showcase-brand-copy {
    min-width: 0;
    display: grid;
    gap: 4px;
}

.showcase-brand-copy h3 {
    margin: 0;
    font-size: 1.34rem;
    line-height: 1.08;
    font-weight: 900;
    letter-spacing: -.03em;
    color: #fbfdff;
}

.showcase-brand-copy span {
    color: var(--muted);
    font-size: .9rem;
    font-weight: 700;
}

.showcase-copy {
    margin: 0;
    color: #c7d0dc;
    line-height: 1.58;
    font-size: .95rem;
    min-height: 78px;
    max-width: 36ch;
}

.showcase-meta,
.showcase-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
}

.showcase-meta-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 13px;
    border-radius: 999px;
    background: rgba(255,255,255,.045);
    border: 1px solid rgba(255,255,255,.08);
    color: #f0f4fa;
    font-size: .81rem;
    font-weight: 800;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}

.showcase-meta-icon {
    width: 14px;
    height: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: rgba(255,255,255,.86);
}

.showcase-meta-icon svg {
    width: 14px;
    height: 14px;
    display: block;
}

.showcase-actions {
    justify-content: space-between;
}

.faq-list,
.docs-grid {
    display: grid;
    gap: 16px;
}

.faq-item {
    padding: 22px;
    border-radius: var(--radius-lg);
    background: var(--surface);
    border: 1px solid var(--line);
    box-shadow: var(--shadow);
}

.faq-item h3,
.docs-steps {
    margin: 0;
}

.faq-item p {
    margin: 10px 0 0;
    color: var(--muted);
    line-height: 1.75;
}

.docs-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.compact-list {
    gap: 8px;
    margin-top: 12px;
}

.docs-steps {
    padding-left: 20px;
    color: #dfe7f1;
    display: grid;
    gap: 10px;
    line-height: 1.75;
}

.page-icon {
    width: 52px;
    height: 52px;
    display: inline-grid;
    place-items: center;
    border-radius: 18px;
    background: linear-gradient(135deg, rgba(243,91,63,.22), rgba(255,193,85,.22));
    border: 1px solid rgba(255,255,255,.08);
    color: #fff;
    font-size: 1.35rem;
    font-weight: 900;
    margin-bottom: 10px;
}

.page-icon.small {
    width: 40px;
    height: 40px;
    border-radius: 14px;
    font-size: 1rem;
}

.blog-card {
    overflow: hidden;
}

.blog-card-link {
    display: grid;
    gap: 16px;
}

.blog-card-copy {
    display: grid;
    gap: 12px;
}

.blog-card-copy h3 {
    margin: 0;
}

.blog-card-copy p {
    margin: 0;
}

.blog-cover {
    min-height: 140px;
    border-radius: 18px;
    display: flex;
    align-items: flex-end;
    padding: 18px;
    color: #fff;
    font-size: 1rem;
    font-weight: 900;
    letter-spacing: .04em;
    box-shadow: inset 0 -40px 80px rgba(0,0,0,.2);
}

.cover-product {
    background: radial-gradient(circle at top left, rgba(255,193,85,.42), transparent 42%), linear-gradient(135deg, #151a22, #342014);
}

.cover-growth {
    background: radial-gradient(circle at top left, rgba(16,220,142,.35), transparent 42%), linear-gradient(135deg, #111924, #18362b);
}

.cover-review {
    background: radial-gradient(circle at top left, rgba(124,92,255,.32), transparent 42%), linear-gradient(135deg, #121420, #2b223f);
}

.blog-article-hero,
.blog-article-body {
    display: grid;
    gap: 18px;
}

.blog-article-body p {
    margin: 0;
}

.faq-accordion {
    display: grid;
    gap: 14px;
}

.faq-accordion-item {
    border-radius: var(--radius-lg);
    background: var(--surface);
    border: 1px solid var(--line);
    box-shadow: var(--shadow);
    overflow: hidden;
}

.faq-accordion-item summary {
    list-style: none;
    cursor: pointer;
    padding: 20px 22px;
    color: #fff;
    font-size: 1.02rem;
    font-weight: 800;
}

.faq-accordion-item summary::-webkit-details-marker {
    display: none;
}

.faq-accordion-item p {
    margin: 0;
    padding: 0 22px 22px;
    color: var(--muted);
    line-height: 1.75;
}

.docs-layout {
    display: grid;
    grid-template-columns: 280px minmax(0, 1fr);
    gap: 22px;
    align-items: start;
}

.docs-sidebar {
    position: sticky;
    top: 96px;
    padding: 20px;
    border-radius: var(--radius-lg);
    background: var(--surface);
    border: 1px solid var(--line);
    box-shadow: var(--shadow);
}

.docs-nav {
    display: grid;
    gap: 10px;
}

.docs-nav a {
    color: #dbe3ee;
    text-decoration: none;
    padding: 10px 12px;
    border-radius: 12px;
    background: rgba(255,255,255,.03);
    border: 1px solid rgba(255,255,255,.05);
}

.docs-nav a:hover,
.docs-nav a:focus-visible {
    color: #fff;
    background: rgba(243,91,63,.14);
    border-color: rgba(243,91,63,.28);
}

.docs-content {
    min-width: 0;
}

.nested-grid {
    margin-top: 8px;
}

.leader-list { margin-top: 10px; }
.leader-item {
    justify-content: space-between;
    padding: 14px 0;
    border-bottom: 1px solid var(--line);
}

.banner { padding: 12px 0 8px; }
.banner-panel {
    border-radius: var(--radius-xl);
    background: linear-gradient(135deg, rgba(255,106,61,.11), rgba(255,193,85,.16));
    border: 1px solid var(--line);
    box-shadow: var(--shadow);
}

.stat-grid.four {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    align-items: stretch;
}

.stat-card {
    min-width: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    min-height: 112px;
    padding: 16px;
}

.stat-card strong,
.stat-card span {
    min-width: 0;
}

.stat-card strong {
    display: block;
    font-size: .98rem;
    line-height: 1.25;
    margin-bottom: 8px;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.stat-card span {
    display: block;
    font-size: .88rem;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.dashboard { grid-template-columns: 260px minmax(0, 1fr) 320px; align-items: start; }
.admin-grid { grid-template-columns: 260px minmax(0, 1fr); align-items: start; }

.column { min-width: 0; display: grid; gap: 16px; }

.menu a {
    padding: 12px 14px;
    border-radius: 12px;
    background: var(--surface-2);
    color: var(--muted);
    font-weight: 700;
}
.menu a.is-active {
    background: linear-gradient(135deg, rgba(255,106,61,.22), rgba(255,193,85,.16));
    color: #fff;
    border: 1px solid rgba(255,106,61,.42);
    box-shadow: inset 0 0 0 1px rgba(255,193,85,.08);
}

.quest-card, .queue-card {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius-lg);
}

.xp { font-weight: 900; color: var(--accent); }

.submission-status {
    margin: 10px 0 0;
    padding: 10px 12px;
    border-radius: 12px;
    background: var(--surface-2);
    border: 1px solid var(--line);
}

.quest-form, .review-form {
    display: grid;
    gap: 12px;
    margin-top: 14px;
}

label { display: grid; gap: 8px; font-weight: 700; }
input, textarea, select {
    width: 100%;
    padding: 12px 14px;
    border-radius: 12px;
    border: 1px solid var(--line);
    background: #0d1117;
    font: inherit;
    color: var(--ink);
}

label.field-invalid {
    color: #ffb4b4;
}

input.is-invalid,
textarea.is-invalid,
select.is-invalid {
    border-color: rgba(255, 92, 92, 0.92);
    box-shadow: 0 0 0 2px rgba(255, 92, 92, 0.16);
}

.button[disabled],
.button.is-disabled {
    opacity: 0.52;
    cursor: not-allowed;
    box-shadow: none;
    pointer-events: none;
}

.progress {
    width: 100%;
    height: 10px;
    border-radius: 999px;
    overflow: hidden;
    background: #233040;
}
.progress span {
    display: block;
    height: 100%;
    background: linear-gradient(90deg, var(--accent), var(--accent-2));
}

.plain-list {
    list-style: none;
    padding: 0;
    margin: 0;
}
.plain-list li {
    padding: 10px 0;
    border-bottom: 1px solid var(--line);
}

.form-grid { grid-template-columns: repeat(2, 1fr); }
.form-grid.single { grid-template-columns: 1fr; }
.form-grid .full { grid-column: 1 / -1; }

.collapsible-box {
    display: grid;
    gap: 16px;
}

.collapsible-box__toggle {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    text-align: left;
}

.collapsible-box__toggle strong {
    color: var(--text);
    font-size: 1.35rem;
    line-height: 1.2;
}

.collapsible-box__eyebrow {
    display: block;
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.collapsible-box__icon {
    width: 34px;
    height: 34px;
    border-radius: 999px;
    border: 1px solid var(--line);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--muted);
    font-size: 1.2rem;
    flex: 0 0 auto;
}

.collapsible-box.is-open .collapsible-box__icon {
    color: #fff;
    border-color: #4d596b;
}

.collapsible-box.is-open .collapsible-box__icon::before {
    content: "-";
}

.collapsible-box:not(.is-open) .collapsible-box__icon::before {
    content: "+";
}

.collapsible-box__body {
    display: grid;
    gap: 16px;
}

.collapsible-box--nested {
    gap: 12px;
}

.collapsible-box--nested .collapsible-box__toggle strong {
    font-size: 1.02rem;
}

body.modal-open {
    overflow: hidden;
}

.launch-builder-card {
    display: grid;
    min-height: 116px;
}

.launch-builder-card--nested {
    min-height: auto;
}

.launch-builder-card__trigger {
    width: 100%;
    min-height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 18px 20px;
    border-radius: 18px;
    border: 1px solid var(--line);
    background: var(--surface-2);
    color: var(--text);
    text-align: left;
}

.launch-builder-card__trigger strong {
    color: var(--text);
    font-size: 1.1rem;
}

.launch-builder-card__eyebrow {
    display: block;
    color: var(--muted);
    font-size: 0.76rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.launch-builder-card__cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 72px;
    min-height: 36px;
    padding: 0 12px;
    border-radius: 999px;
    border: 1px solid #374354;
    color: #eef4fb;
    background: rgba(255,255,255,0.04);
    font-weight: 800;
    flex: 0 0 auto;
}

.launch-builder-modal {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 16px;
    overflow-y: auto;
}

.launch-builder-modal .quest-modal__backdrop {
    position: fixed;
}

.launch-builder-modal__dialog {
    box-sizing: border-box;
    width: min(820px, 100%);
    height: min(640px, calc(100vh - 32px));
    max-height: calc(100vh - 32px);
    margin: 0;
    padding: 0;
    overflow: hidden;
}

.launch-builder-modal .launch-builder-modal__content {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    max-height: 100%;
    height: 100%;
    padding: 0;
    overflow: hidden;
    background: #121821;
}

.launch-builder-modal__footer {
    flex: 0 0 auto;
}

.launch-builder-modal__header {
    position: sticky;
    top: 0;
    z-index: 2;
    flex: 0 0 auto;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    padding: 14px 88px 12px 18px;
    border-bottom: 1px solid rgba(255,255,255,0.08);
    background:
        radial-gradient(circle at 18% 22%, rgba(255,255,255,0.14), transparent 26%),
        linear-gradient(110deg, rgba(243,91,63,0.96), rgba(255,193,85,0.82));
}

.launch-builder-modal__headcopy {
    display: grid;
    gap: 6px;
}

.launch-builder-modal__eyebrow {
    margin: 0;
    color: rgba(255,255,255,0.78);
    letter-spacing: 0.08em;
    font-size: 0.72rem;
}

.launch-builder-modal__title {
    margin: 0;
    color: #fff;
    font-size: clamp(1.12rem, 1.9vw, 1.55rem);
    line-height: 1.05;
    letter-spacing: -0.03em;
}

.launch-builder-modal__body {
    display: grid;
    min-height: 0;
    gap: 12px;
    padding: 14px 16px 12px;
    overflow-y: scroll;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: rgba(255,255,255,0.32) rgba(255,255,255,0.06);
}

.launch-builder-modal__body::-webkit-scrollbar {
    width: 12px;
}

.launch-builder-modal__body::-webkit-scrollbar-track {
    background: rgba(255,255,255,0.05);
}

.launch-builder-modal__body::-webkit-scrollbar-thumb {
    background: rgba(255,255,255,0.3);
    border-radius: 999px;
    border: 2px solid rgba(0,0,0,0);
    background-clip: padding-box;
}

.launch-builder-modal__close {
    top: 14px;
    right: 14px;
    z-index: 4;
    width: 64px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border-radius: 999px;
    border: 1px solid rgba(255,255,255,0.36);
    background: rgba(9, 12, 17, 0.84);
    color: #fff;
    font-size: 2.2rem;
    font-weight: 900;
    line-height: 1;
    box-shadow: 0 14px 34px rgba(0,0,0,0.28);
    cursor: pointer;
    pointer-events: auto;
}

.launch-builder-modal__close:hover,
.launch-builder-modal__close:focus-visible {
    background: rgba(9, 12, 17, 0.94);
    border-color: rgba(255,255,255,0.58);
}

.launch-builder-modal__body form > .button:last-child,
.launch-builder-modal__body form .button-row:last-child,
.launch-builder-modal__body form .top-gap:last-child {
    position: sticky;
    bottom: -10px;
    z-index: 2;
    display: flex;
    justify-content: flex-end;
    padding-top: 14px;
    padding-bottom: 12px;
    background: linear-gradient(180deg, rgba(13,17,23,0), rgba(13,17,23,0.92) 26%, rgba(13,17,23,1));
}

.launch-builder-modal__body form > .button:last-child {
    display: block;
    width: fit-content;
    grid-column: 1 / -1;
    margin-left: auto;
    margin-right: 0;
    align-self: flex-end;
    justify-self: end;
}

.launch-builder-modal__body form .button-row,
.launch-builder-modal__body form .campaign-owner-actions,
.launch-builder-modal__body form .top-gap.button-row {
    width: 100%;
    justify-content: flex-end;
    margin-left: auto;
}

.template-modal-actions {
    z-index: 3;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: nowrap;
    gap: 8px;
    padding: 10px 16px 12px;
    margin-top: 0;
    border-top: 1px solid rgba(255,255,255,0.08);
    background: #121821;
}

.template-modal-actions .button {
    min-width: 104px;
    min-height: 42px;
}

.template-modal-actions .button[data-template-footer-next],
.template-modal-actions .button[data-template-footer-save] {
    visibility: visible;
}

.template-modal-actions--persistent .button[data-template-footer-save] {
    margin-left: auto;
}

.template-modal-actions .button[disabled] {
    opacity: 0.55;
    cursor: not-allowed;
}

.launch-builder-modal__body form .button-row > .button:last-child,
.launch-builder-modal__body form .campaign-owner-actions > .button:last-child {
    margin-right: 0;
}

.template-strip {
    margin-bottom: 18px;
    padding: 18px;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: var(--surface-2);
}

.template-strip-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 14px;
}

.template-strip-head strong {
    font-size: 1.2rem;
    color: var(--text);
}

.template-strip-head span {
    color: var(--muted);
}

.template-card-row {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(92px, 92px));
    gap: 8px;
}

.template-pick-card {
    display: grid;
    align-content: start;
    gap: 7px;
    min-height: 88px;
    padding: 9px 8px;
    border-radius: 12px;
    border: 1px solid var(--template-card-border, var(--line));
    background:
        radial-gradient(circle at top left, rgba(255,255,255,0.05), transparent 36%),
        var(--template-card-bg, #11161d);
    color: var(--text);
    text-align: left;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,0.015);
}

.template-pick-card:hover,
.template-pick-card:focus-visible {
    border-color: color-mix(in srgb, var(--template-card-border, #4e5d72) 88%, #ffffff 12%);
    transform: translateY(-1px);
}

.template-pick-badge,
.template-helper-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    min-width: 50px;
    min-height: 50px;
    padding: 0;
    border-radius: 999px;
    border: 1px solid var(--template-badge-border, rgba(255,255,255,0.12));
    background: var(--template-badge-bg, rgba(243, 91, 63, 0.12));
    color: var(--template-badge-text, #ffc9b7);
    font-size: 0.74rem;
    font-weight: 800;
    letter-spacing: 0.03em;
}

.template-pick-icon {
    width: 24px;
    height: 24px;
    display: block;
    object-fit: contain;
}

.template-pick-icon--light {
    filter: brightness(0) invert(1);
    opacity: 0.96;
}

.template-pick-card strong,
.template-helper-copy strong {
    color: var(--text);
}

.template-pick-card strong {
    font-size: 0.64rem;
    line-height: 1.18;
    letter-spacing: 0.01em;
}

.template-pick-card p,
.template-pick-meta,
.template-helper-copy p {
    margin: 0;
    color: var(--muted);
    line-height: 1.5;
}

.template-helper-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 12px 14px;
    border-radius: 16px;
    border: 1px solid var(--line);
    background: rgba(255,255,255,0.03);
}

.template-helper-copy {
    display: grid;
    gap: 6px;
}

.template-wizard-steps {
    display: flex;
    flex-wrap: nowrap;
    gap: 10px;
    align-items: center;
}

.template-wizard-step {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    min-width: 0;
    min-height: 40px;
    padding: 0 16px;
    border-radius: 999px;
    border: 1px solid #334052;
    background: #111821;
    color: #cbd6e5;
    font-weight: 800;
    white-space: nowrap;
    line-height: 1;
}

.template-wizard-step.is-active {
    border-color: rgba(243, 91, 63, 0.4);
    background: rgba(243, 91, 63, 0.14);
    color: #fff;
}

.template-wizard-panel {
    display: none;
    gap: 12px;
}

.template-wizard-panel.is-active {
    display: grid;
}

.template-wizard-panel--compact {
    gap: 0;
    align-content: start;
    margin-top: -4px;
    padding-top: 0;
}

.template-wizard-panel--compact label {
    gap: 2px;
    margin: 0;
}

.template-wizard-panel--compact .checkbox-row {
    margin-top: 0;
}

.template-requirement-label-row {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.template-requirement-help {
    width: 18px;
    height: 18px;
    min-width: 18px;
    min-height: 18px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border-radius: 999px;
    border: 1px solid rgba(255,255,255,0.18);
    background: rgba(255,255,255,0.06);
    color: #dce7f6;
    font-size: 0.7rem;
    font-weight: 900;
    line-height: 1;
    cursor: help;
}

.template-requirement-help:hover,
.template-requirement-help:focus-visible {
    border-color: rgba(255,255,255,0.28);
    background: rgba(255,255,255,0.1);
}

.template-wizard-note {
    padding: 10px 12px;
    border-radius: 14px;
    border: 1px solid rgba(255,255,255,0.06);
    background: rgba(255,255,255,0.03);
    color: #c8d4e3;
    line-height: 1.45;
}

.template-form-grid {
    gap: 12px;
    align-content: start;
    align-items: start;
    grid-auto-rows: max-content;
}

#campaign-template-modal .launch-builder-modal__dialog {
    height: min(600px, calc(100vh - 32px));
    max-height: calc(100vh - 32px);
}

#leaderboard-modal .launch-builder-modal__dialog {
    width: min(920px, calc(100% - 32px));
    height: min(720px, calc(100vh - 32px));
    max-height: calc(100vh - 32px);
}

#leaderboard-modal .launch-builder-modal__body {
    padding-right: 12px;
}

#leaderboard-modal .questboard-leaderboard-list.modal-list {
    max-height: 420px;
    overflow-y: scroll;
    padding-right: 6px;
}

#campaign-template-modal .launch-builder-modal__content {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
}

#campaign-template-modal .launch-builder-modal__body {
    display: block;
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding-right: 12px;
}

#campaign-template-modal .launch-builder-modal__footer {
    flex: 0 0 auto;
}

#campaign-template-modal .template-form-grid {
    display: grid;
    align-content: start;
    min-height: max-content;
    padding-bottom: 12px;
}

.template-form-grid > .full,
.template-form-grid > .template-wizard-panel {
    align-self: start;
}

.template-basics-inline {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.admin-top-tabs {
    display: flex;
    gap: 12px;
    margin-bottom: 20px;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 20px;
    background: var(--surface-2);
}

.admin-top-tab {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 1 1 0;
    min-height: 42px;
    padding: 0 18px;
    border-radius: 999px;
    border: 1px solid var(--line);
    background: var(--surface-2);
    color: var(--text);
    font-weight: 800;
    font-size: 1rem;
}

.admin-top-tab.is-active {
    border-color: rgba(243, 91, 63, 0.45);
    background: rgba(243, 91, 63, 0.16);
}

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

.admin-toolbar {
    display: grid;
    gap: 14px;
    margin-bottom: 18px;
}

.admin-top-podium {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    margin-bottom: 18px;
}

.admin-podium-card {
    display: grid;
    gap: 8px;
    padding: 18px;
    border-radius: 18px;
    border: 1px solid var(--line);
    background: var(--surface-2);
}

.admin-podium-card--1 {
    border-color: rgba(255, 193, 85, 0.5);
    background: linear-gradient(180deg, rgba(255,193,85,0.16), rgba(23,29,38,0.98));
}

.admin-podium-card--2 {
    border-color: rgba(152, 175, 201, 0.42);
}

.admin-podium-card--3 {
    border-color: rgba(243, 91, 63, 0.42);
}

.admin-podium-rank {
    color: #ffc155;
    font-weight: 900;
    font-size: 0.9rem;
}

.admin-user-xp,
.admin-audit-meta {
    display: grid;
    justify-items: end;
    gap: 4px;
}

.admin-user-xp strong,
.admin-audit-meta span {
    color: #fff;
    font-weight: 900;
}

.admin-pagination {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 18px;
    align-items: center;
}

.admin-pagination--meta-only {
    justify-content: flex-start;
}

.admin-pagination-meta {
    margin-right: 8px;
    color: #8ea1b8;
    font-size: 0.9rem;
    font-weight: 700;
}

.admin-page-link {
    min-width: 40px;
    min-height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 12px;
    border-radius: 999px;
    border: 1px solid var(--line);
    background: var(--surface-2);
    color: var(--text);
    font-weight: 800;
}

.admin-page-link--wide {
    padding-inline: 14px;
}

.admin-page-link.is-active {
    border-color: rgba(243, 91, 63, 0.45);
    background: rgba(243, 91, 63, 0.16);
    color: #fff;
}

.admin-page-link.is-disabled {
    opacity: 0.45;
    pointer-events: none;
}

.admin-page-ellipsis {
    min-width: 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #8ea1b8;
    font-weight: 900;
}

.admin-live-search input {
    width: 100%;
    min-height: 48px;
    padding: 0 16px;
    border-radius: 16px;
    border: 1px solid var(--line);
    background: #0f141c;
    color: var(--text);
    font: inherit;
}

.admin-live-search input::placeholder {
    color: var(--muted);
}

.admin-list-card {
    display: grid;
    gap: 14px;
    padding: 18px;
    border: 1px solid var(--line);
    border-radius: var(--radius-lg);
    background: var(--surface-2);
}

.admin-list-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}

.admin-inline-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.admin-inline-actions form {
    margin: 0;
}

.admin-inline-panel {
    padding-top: 4px;
}

.admin-campaign-link {
    color: var(--text);
    text-decoration: none;
}

.admin-campaign-link:hover,
.admin-campaign-link:focus-visible {
    color: #ffffff;
    text-decoration: underline;
}

.admin-social-links {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 8px;
}

.admin-social-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    padding: 0;
    border-radius: 999px;
    border: 1px solid #334052;
    background: rgba(255,255,255,0.04);
    color: #eef4fb;
    text-decoration: none;
}

.admin-social-link img {
    width: 18px;
    height: 18px;
    display: block;
    object-fit: contain;
    filter: brightness(0) invert(1);
}

.admin-social-link:hover,
.admin-social-link:focus-visible {
    border-color: rgba(243, 91, 63, 0.45);
    background: rgba(243, 91, 63, 0.14);
}

.template-wizard-actions {
    justify-content: space-between;
}

.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; }
th, td { padding: 14px 10px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
th { color: var(--muted); text-transform: uppercase; font-size: .82rem; letter-spacing: .06em; }

.auth-section {
    display: grid;
    place-items: center;
    padding: 36px 0;
}

.auth-card {
    width: min(760px, 100%);
}

.wallet-auth-card {
    margin-bottom: 18px;
    padding: 18px;
    border-radius: var(--radius-lg);
    background: var(--surface-2);
    border: 1px solid var(--line);
}

.wallet-auth-card h3 {
    margin: 0 0 8px;
}

.wallet-auth-card p {
    margin: 0 0 14px;
}

.wallet-auth-form {
    display: grid;
    gap: 12px;
}

.wallet-picker-modal__dialog {
    width: min(860px, calc(100% - 32px));
    max-height: calc(100vh - 48px);
    padding: 0;
    overflow: hidden;
    border-radius: 26px;
    background: #e9edf4;
}

.wallet-picker-modal__close {
    top: 16px;
    right: 16px;
    width: 42px;
    height: 42px;
    border-color: rgba(18, 24, 33, 0.12);
    background: rgba(255,255,255,0.72);
    color: #334155;
}

.wallet-picker-modal__layout {
    display: grid;
    grid-template-columns: 296px minmax(0, 1fr);
    min-height: 540px;
}

.wallet-picker-modal__rail {
    display: grid;
    align-content: start;
    gap: 18px;
    padding: 22px 18px 22px 18px;
    background: #f5f7fb;
    border-right: 1px solid rgba(18,24,33,0.08);
}

.wallet-picker-modal__copy {
    display: grid;
    gap: 8px;
}

.wallet-picker-modal__copy strong {
    color: #111827;
    font-size: 1.15rem;
}

.wallet-picker-modal__copy p {
    margin: 0;
    color: #64748b;
    line-height: 1.55;
}

.wallet-picker-modal__list {
    display: grid;
    gap: 12px;
}

.wallet-picker-option {
    width: 100%;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 14px;
    align-items: center;
    padding: 14px 16px;
    border-radius: 16px;
    border: 1px solid rgba(18,24,33,0.1);
    background: #ffffff;
    text-align: left;
    transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}

.wallet-picker-option:hover,
.wallet-picker-option:focus-visible {
    transform: translateY(-1px);
    border-color: rgba(255,106,61,0.35);
    box-shadow: 0 12px 24px rgba(15,23,42,0.08);
}

.wallet-picker-option.is-disabled {
    background: #f8fafc;
    opacity: .68;
    cursor: not-allowed;
}

.wallet-picker-option__icon {
    width: 48px;
    height: 48px;
    border-radius: 14px;
    display: grid;
    place-items: center;
    background: var(--wallet-accent, #ff6a3d);
    color: #fff;
    font-size: 1.1rem;
    font-weight: 900;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,0.08);
}

.wallet-picker-option__copy {
    display: grid;
    gap: 4px;
    min-width: 0;
}

.wallet-picker-option__copy strong {
    color: #111827;
    font-size: 1rem;
}

.wallet-picker-option__copy small {
    color: #64748b;
}

.wallet-picker-modal__hero {
    display: grid;
    place-content: center;
    justify-items: center;
    gap: 16px;
    padding: 42px;
    text-align: center;
    background: linear-gradient(180deg, #eef2f8, #e7ecf5);
}

.wallet-picker-modal__logo {
    width: 92px;
    height: 92px;
    border-radius: 24px;
    display: grid;
    place-items: center;
    background: linear-gradient(135deg, #ff7b47, #f35b3f);
    box-shadow: 0 18px 38px rgba(243,91,63,0.24);
}

.wallet-picker-modal__logo span {
    color: #fff;
    font-size: 2.5rem;
    font-weight: 900;
}

.wallet-picker-modal__hero h3 {
    margin: 0;
    color: #1e293b;
    font-size: 2rem;
    line-height: 1.08;
}

.wallet-picker-modal__hero p,
.wallet-picker-modal__footnote {
    margin: 0;
    color: #64748b;
    line-height: 1.7;
    max-width: 36ch;
}

.wallet-picker-modal__footnote {
    font-size: .92rem;
}

.avatar-picker-wrap {
    display: grid;
    gap: 16px;
}

.avatar-picker-wrap.compact {
    gap: 0;
}

.avatar-picker-head,
.account-avatar-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 16px;
    border-radius: 18px;
    background: var(--surface-2);
    border: 1px solid var(--line);
}

.profile-campaign-block {
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px solid var(--line);
}

.profile-campaign-block .section-title {
    font-size: 1.1rem;
    line-height: 1.35;
    margin-bottom: 10px;
}

.avatar-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 12px;
}

.avatar-option {
    position: relative;
    display: grid;
    gap: 8px;
    justify-items: center;
    text-align: center;
    padding: 12px 10px;
    border-radius: 18px;
    background: var(--surface-2);
    border: 1px solid var(--line);
    cursor: pointer;
}

.avatar-button {
    width: 100%;
    font: inherit;
    color: var(--ink);
}

.avatar-option input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.avatar-option:has(input:checked) {
    border-color: rgba(255,106,61,.55);
    box-shadow: inset 0 0 0 1px rgba(255,106,61,.18);
}

.avatar-option.is-selected {
    border-color: rgba(255,106,61,.55);
    box-shadow: inset 0 0 0 1px rgba(255,106,61,.18);
}

.avatar-swatch,
.profile-avatar-preview {
    width: 56px;
    height: 56px;
    border-radius: 18px;
    display: grid;
    place-items: center;
    color: #fff;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.08);
    box-shadow: 0 10px 24px rgba(0,0,0,.2);
}

.avatar-swatch span,
.profile-avatar-preview span {
    font-size: 1.4rem;
    font-weight: 900;
}

.avatar-swatch img,
.profile-avatar-preview img {
    width: 72%;
    height: 72%;
    object-fit: contain;
    display: block;
}

.profile-avatar-preview.large {
    width: 74px;
    height: 74px;
    border-radius: 22px;
}

.avatar-modal-dialog {
    max-width: 920px;
}

.campaign-profile-row {
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.campaign-profile-main {
    display: grid;
    gap: 4px;
}

.notification-panel {
    position: relative;
}

.notification-trigger {
    position: relative;
    min-width: 46px;
    padding: 0 12px;
}

.notification-bell {
    font-size: 1.05rem;
    line-height: 1;
}

.notification-count {
    min-width: 20px;
    height: 20px;
    padding: 0 6px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: linear-gradient(135deg, var(--accent), #ff845c);
    color: #fff;
    font-size: .74rem;
    font-weight: 900;
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.notification-popover {
    position: absolute;
    right: 0;
    top: calc(100% + 10px);
    width: 320px;
    padding: 16px;
    border-radius: 18px;
    background: var(--surface);
    border: 1px solid var(--line);
    box-shadow: 0 18px 40px rgba(0,0,0,.35);
    z-index: 50;
}

.notification-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}

.notification-list {
    display: grid;
    gap: 10px;
}

.notification-item {
    display: grid;
    gap: 4px;
    padding: 12px;
    border-radius: 14px;
    background: var(--surface-2);
    border: 1px solid var(--line);
}

.notification-item.is-unread {
    border-color: rgba(255,106,61,.5);
    box-shadow: inset 0 0 0 1px rgba(255,106,61,.18);
}

.top-gap {
    margin-top: 14px;
}

.condition-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 14px;
    margin-top: 10px;
}

.condition-card {
    padding: 14px;
    border-radius: 16px;
    background: var(--surface-2);
    border: 1px solid var(--line);
    display: grid;
    gap: 10px;
}

.auth-divider {
    position: relative;
    margin: 22px 0 18px;
    text-align: center;
    color: var(--muted);
    font-size: 0.9rem;
    font-weight: 700;
}

.auth-divider::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    height: 1px;
    background: var(--line);
}

.auth-divider span {
    position: relative;
    z-index: 1;
    padding: 0 12px;
    background: var(--bg);
}

.campaign-cover-preview {
    margin: -22px -22px 16px;
    height: 150px;
    border-bottom: 1px solid var(--line);
    overflow: hidden;
    border-radius: var(--radius-lg) var(--radius-lg) 0 0;
    background: #0f141d;
}

.campaign-cover-preview img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.campaign-logo-row {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
    color: var(--muted);
}

.campaign-logo-thumb {
    width: 52px;
    height: 52px;
    border-radius: 14px;
    object-fit: cover;
    border: 1px solid var(--line);
    background: #0f141d;
}

.campaign-owner-actions {
    margin: 14px 0 10px;
}

.quest-order-box {
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid var(--line);
}

.quest-order-box h4 {
    margin: 0 0 12px;
}

.quest-order-form {
    display: grid;
    gap: 10px;
}

.drag-quest-list {
    display: grid;
    gap: 10px;
}

.drag-quest-row {
    display: grid;
    grid-template-columns: 30px minmax(0, 1fr);
    gap: 12px;
    align-items: center;
    padding: 12px 14px;
    border-radius: 12px;
    border: 1px solid var(--line);
    background: var(--surface-2);
    cursor: move;
}

.drag-quest-row.is-dragging {
    opacity: 0.55;
}

.drag-handle {
    color: var(--muted);
    font-weight: 900;
    letter-spacing: 0.08em;
}

.drag-quest-copy {
    display: grid;
    gap: 4px;
}

.drag-quest-copy span {
    color: var(--muted);
    font-size: 0.9rem;
}

.drag-save-status {
    color: var(--muted);
    font-size: 0.9rem;
}

.group-board {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    gap: 16px;
}

.group-board-column {
    min-height: 220px;
    padding: 12px;
    border-radius: 16px;
    border: 1px solid var(--line);
    background: #11161d;
}

.group-board-column-head {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 12px;
}

.group-board-column-head strong {
    color: var(--text);
}

.group-board-list {
    display: grid;
    gap: 10px;
    min-height: 140px;
}

.group-board-card {
    display: grid;
    gap: 6px;
    padding: 12px;
    border-radius: 12px;
    border: 1px solid var(--line);
    background: var(--surface-2);
    cursor: grab;
}

.group-board-card strong {
    color: var(--text);
}

.group-board-card span {
    color: var(--muted);
    font-size: 0.84rem;
}

.proof-thumb {
    width: 84px;
    height: 84px;
    object-fit: cover;
    border-radius: 12px;
    border: 1px solid var(--line);
    margin-top: 8px;
    background: #0d1117;
    cursor: zoom-in;
}

.toast-root {
    position: fixed;
    right: 18px;
    bottom: 18px;
    z-index: 80;
    display: grid;
    gap: 10px;
}

.toast {
    min-width: 220px;
    padding: 10px 14px;
    border-radius: 999px;
    color: #fff;
    font-weight: 800;
    box-shadow: 0 18px 40px rgba(0,0,0,.28);
    border: 1px solid rgba(255,255,255,0.16);
    letter-spacing: 0.03em;
}

.toast-info {
    background: linear-gradient(135deg, #1b4fd6, #2f6fed);
}

.toast-success {
    background: linear-gradient(135deg, #0f7b53, #1e8b60);
}

.toast-error {
    background: linear-gradient(135deg, #8f2736, #b33f47);
}

.image-lightbox[hidden] {
    display: none;
}

.image-lightbox {
    position: fixed;
    inset: 0;
    z-index: 90;
}

.image-lightbox__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.82);
}

.image-lightbox__dialog {
    position: relative;
    z-index: 1;
    width: min(960px, calc(100% - 32px));
    margin: 5vh auto 0;
    padding: 16px;
    border-radius: 18px;
    background: #111821;
    border: 1px solid #2b3644;
}

.image-lightbox__close {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 38px;
    height: 38px;
    border: 1px solid #425063;
    border-radius: 999px;
    background: #0d1117;
    color: #fff;
    cursor: pointer;
    font-size: 1.2rem;
}

.image-lightbox__image {
    display: block;
    width: 100%;
    max-height: 82vh;
    object-fit: contain;
    border-radius: 12px;
    background: #0d1117;
}

.campaign-edit-form {
    display: grid;
    gap: 12px;
}

.campaign-quest-editor-list {
    display: grid;
    gap: 16px;
}

.campaign-stack {
    display: grid;
    gap: 20px;
}

.compact-stats {
    margin-top: 14px;
}

.stack-list {
    display: grid;
    gap: 10px;
}

.stack-row {
    display: grid;
    gap: 4px;
    padding: 12px 14px;
    border-radius: 12px;
    background: var(--surface-2);
    border: 1px solid var(--line);
}

.color-chip {
    width: 12px;
    height: 12px;
    border-radius: 999px;
    display: inline-block;
}

.moderation-form {
    display: grid;
    gap: 8px;
}

.checkbox-row {
    display: flex;
    align-items: center;
    gap: 10px;
}

.checkbox-row input[type="checkbox"] {
    width: 18px;
    height: 18px;
}

.quest-order-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 84px;
    gap: 12px;
    align-items: center;
}

.quest-order-row input {
    min-width: 0;
}

.delete-quest-list {
    display: grid;
    gap: 10px;
}

.delete-quest-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.inline-delete-form {
    margin-top: 12px;
}

.quest-delete-button {
    min-height: 36px;
    padding: 0 12px;
    background: #b42318;
    border-color: #ef4444;
    color: #fff;
}

.quest-delete-button:hover,
.quest-delete-button:focus-visible {
    background: #d92d20;
    border-color: #f87171;
    color: #fff;
}

.profile-layout { grid-template-columns: 1fr 360px; align-items: start; }

.flash {
    margin: 8px 0 18px;
    padding: 14px 16px;
    border-radius: 14px;
    font-weight: 700;
}
.flash-success { background: rgba(30,139,96,.12); border: 1px solid rgba(30,139,96,.3); color: #92d8b4; }
.flash-error { background: rgba(192,76,76,.12); border: 1px solid rgba(239,178,178,.25); color: #f0aaaa; }

.footer {
    padding: 28px 0 42px;
    color: var(--muted);
}

.footer-rich {
    margin-top: 28px;
    border-top: 1px solid rgba(255,255,255,.08);
}

.footer-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) repeat(3, minmax(180px, 1fr));
    gap: 32px;
    padding-top: 30px;
}

.footer-brand-column {
    display: grid;
    gap: 18px;
    max-width: 460px;
}

.footer-brand {
    display: inline-flex;
    width: fit-content;
}

.footer-brand img {
    width: 188px;
    height: auto;
    display: block;
}

.footer-copy {
    margin: 0;
    color: #b9c2ce;
    line-height: 1.8;
    max-width: 40ch;
}

.footer-links-group {
    display: grid;
    align-content: start;
    gap: 12px;
}

.footer-heading {
    color: #ffffff;
    font-size: .78rem;
    font-weight: 900;
    letter-spacing: .12em;
    text-transform: uppercase;
    margin-bottom: 6px;
}

.footer-links-group a {
    color: #c8d0db;
    text-decoration: none;
    transition: color .18s ease;
}

.footer-links-group a:hover,
.footer-links-group a:focus-visible {
    color: #ffffff;
}

body.questboard-theme .shell {
    width: min(1380px, calc(100% - 24px));
}

.topbar {
    border-bottom: 1px solid #232b36;
}

.brand-mark {
    background: linear-gradient(135deg, #ff7b47, #f9493f);
}

.button-primary {
    background: #f35b3f;
    color: #fff;
    box-shadow: none;
}

.crew3-shell {
    --campaign-accent: #f35b3f;
    --campaign-surface: #121821;
    --campaign-glow: #ffc155;
    padding: 18px 0 36px;
}

.questboard-layout-shell {
    padding-top: 12px;
}

.questboard-layout {
    display: grid;
    grid-template-columns: 64px 320px minmax(0, 1fr);
    gap: 16px;
    align-items: start;
}

.questboard-layout--no-rail {
    grid-template-columns: 320px minmax(0, 1fr);
}

.questboard-campaign-rail {
    position: sticky;
    top: 86px;
    display: grid;
    gap: 14px;
}

.questboard-rail-item {
    width: 52px;
    height: 52px;
    border-radius: 18px;
    border: 1px solid #2a3240;
    background: #121821;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,0.02);
}

.questboard-rail-item.is-current {
    border-color: rgba(243,91,63,0.55);
    box-shadow: 0 0 0 2px rgba(243,91,63,0.18);
}

.questboard-rail-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.questboard-rail-item span {
    font-size: 1.05rem;
    font-weight: 900;
    color: #fff;
}

.questboard-sidepanel {
    position: sticky;
    top: 86px;
    display: grid;
    gap: 14px;
    padding: 14px;
    border-radius: 24px;
    border: 1px solid #242d39;
    background: #131921;
}

.questboard-sidepanel__campaign,
.questboard-sidepanel__block,
.questboard-profile-footer {
    padding: 14px;
    border-radius: 20px;
    border: 1px solid #252e3b;
    background: #0f141b;
}

.questboard-manage-panel summary {
    cursor: pointer;
    list-style: none;
    font-weight: 800;
    color: #f7fbff;
}

.questboard-manage-panel summary::-webkit-details-marker {
    display: none;
}

.questboard-manage-stack {
    display: grid;
    gap: 14px;
    margin-top: 14px;
}

.questboard-manage-form .button {
    margin-top: 4px;
}

.questboard-manage-board {
    grid-template-columns: 1fr;
}

.questboard-sidepanel__brand {
    display: grid;
    grid-template-columns: 76px minmax(0, 1fr);
    gap: 14px;
}

.questboard-sidepanel__logo {
    width: 76px;
    height: 76px;
    border-radius: 20px;
    border: 1px solid #2a3240;
    background: linear-gradient(135deg, rgba(243,91,63,0.95), rgba(255,193,85,0.72));
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.questboard-sidepanel__logo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.questboard-sidepanel__logo span {
    color: #fff;
    font-size: 2rem;
    font-weight: 900;
}

.questboard-sidepanel__copy {
    display: grid;
    gap: 8px;
}

.questboard-sidepanel__copy strong,
.questboard-block-head strong,
.questboard-profile-footer strong {
    color: #f7fbff;
}

.questboard-sidepanel__copy p,
.questboard-profile-footer span,
.questboard-block-head span,
.questboard-leaderboard-row span,
.questboard-inbox-row span {
    margin: 0;
    color: #96a4b9;
}

.questboard-sidepanel__links {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.questboard-sidepanel__links a,
.questboard-sidepanel__links button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 999px;
    border: 1px solid #2f3948;
    background: rgba(255,255,255,0.03);
    color: #eef4fb;
    font-size: 0.82rem;
    font-weight: 700;
    transition: transform .18s ease, border-color .18s ease, background-color .18s ease;
    cursor: pointer;
}

.questboard-sidepanel__links a:hover,
.questboard-sidepanel__links a:focus-visible,
.questboard-sidepanel__links button:hover,
.questboard-sidepanel__links button:focus-visible {
    transform: translateY(-1px);
    border-color: rgba(255,255,255,.24);
    background: rgba(255,255,255,.06);
}

.questboard-sidepanel__links a svg,
.questboard-sidepanel__links button svg {
    width: 17px;
    height: 17px;
    display: block;
}

.questboard-sidepanel__links a span,
.questboard-sidepanel__links button span {
    font-size: 0.7rem;
    letter-spacing: 0.04em;
}

.questboard-share-link {
    width: 100%;
    margin-top: 10px;
}

.questboard-deletion-request-link {
    width: 100%;
    margin-top: 10px;
    border-color: rgba(243, 91, 63, 0.35);
    color: #ff9f88;
}

.questboard-deletion-request-link:hover,
.questboard-deletion-request-link:focus-visible {
    border-color: rgba(243, 91, 63, 0.55);
    background: rgba(243, 91, 63, 0.1);
    color: #ffd2c6;
}

.questboard-share-link.is-copied {
    border-color: rgba(255, 193, 85, 0.4);
    background: rgba(255, 193, 85, 0.12);
    color: #ffc155;
}

.quest-delete-request-content {
    display: grid;
    gap: 16px;
}

.quest-delete-request-form {
    gap: 14px;
}

.quest-delete-confirm-dialog {
    max-width: 460px;
}

.quest-delete-confirm-content {
    display: grid;
    gap: 14px;
    padding: 26px;
}

.quest-delete-confirm-content h3 {
    margin: 0;
    font-size: 1.45rem;
    line-height: 1.08;
}

.quest-delete-confirm-copy {
    margin: 0;
    color: #a9b6c8;
    line-height: 1.6;
}

.quest-delete-confirm-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding-top: 4px;
}

.questboard-sidepanel__menu {
    display: grid;
    gap: 8px;
}

.questboard-menu-item {
    width: 100%;
    display: flex;
    align-items: center;
    min-height: 46px;
    padding: 0 14px;
    border-radius: 16px;
    border: 1px solid transparent;
    color: #eef4fb;
    background: rgba(255,255,255,0.03);
    font-weight: 800;
    text-align: left;
}

.questboard-menu-item.is-active,
.questboard-menu-item:hover,
.questboard-menu-item:focus-visible {
    border-color: #2f3948;
    background: rgba(255,255,255,0.07);
}

.questboard-block-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}

.questboard-leaderboard-list,
.questboard-inbox-list {
    display: grid;
    gap: 10px;
    max-height: 300px;
    overflow-y: scroll;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
    scrollbar-width: thin;
    scrollbar-color: rgba(255,255,255,0.32) rgba(255,255,255,0.06);
    padding-right: 4px;
}

.modal-list {
    max-height: 520px;
}

.questboard-leaderboard-list::-webkit-scrollbar,
.questboard-inbox-list::-webkit-scrollbar {
    width: 12px;
}

.questboard-leaderboard-list::-webkit-scrollbar-track,
.questboard-inbox-list::-webkit-scrollbar-track {
    background: rgba(255,255,255,0.05);
}

.questboard-leaderboard-list::-webkit-scrollbar-thumb,
.questboard-inbox-list::-webkit-scrollbar-thumb {
    background: rgba(255,255,255,0.3);
    border-radius: 999px;
    border: 2px solid rgba(0,0,0,0);
    background-clip: padding-box;
}

.leaderboard-podium {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 14px;
}

.leaderboard-podium-card,
.leaderboard-you-card {
    padding: 14px;
    border-radius: 16px;
    border: 1px solid #2b3543;
    background: linear-gradient(180deg, rgba(255,255,255,0.04), rgba(255,255,255,0.02));
}

.leaderboard-podium-card--1 {
    border-color: rgba(255, 193, 85, 0.42);
    background: linear-gradient(180deg, rgba(255,193,85,0.16), rgba(255,193,85,0.05));
}

.leaderboard-podium-card--2 {
    border-color: rgba(162, 178, 196, 0.42);
}

.leaderboard-podium-card--3 {
    border-color: rgba(243, 91, 63, 0.38);
}

.leaderboard-podium-rank {
    display: inline-flex;
    margin-bottom: 8px;
    color: #fff;
    font-size: .78rem;
    font-weight: 900;
    letter-spacing: .08em;
}

.leaderboard-podium-card strong,
.leaderboard-you-card strong {
    display: block;
    margin-bottom: 4px;
    color: #fff;
}

.leaderboard-podium-card span,
.leaderboard-you-card span,
.leaderboard-you-card small {
    color: #9dacbf;
}

.leaderboard-you-card {
    display: grid;
    gap: 4px;
    margin-bottom: 14px;
    border-color: rgba(243, 91, 63, 0.3);
}

.questboard-leaderboard-row,
.questboard-inbox-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 10px 12px;
    border-radius: 14px;
    border: 1px solid #25303d;
    background: #121821;
}

.questboard-leaderboard-row.is-current-user {
    border-color: rgba(243, 91, 63, 0.4);
    background: rgba(243, 91, 63, 0.09);
}

.questboard-leaderboard-row strong,
.questboard-inbox-row strong {
    flex: 1 1 auto;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.questboard-leaderboard-row span,
.questboard-inbox-row span {
    flex: 0 0 auto;
    white-space: nowrap;
}

.questboard-feed-row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    padding: 12px 14px;
    border-radius: 16px;
    border: 1px solid #25303d;
    background: #121821;
}

.questboard-feed-icon {
    min-width: 54px;
    min-height: 38px;
    padding: 0 10px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(255,255,255,0.06);
    color: #fff;
    font-size: .72rem;
    font-weight: 900;
    letter-spacing: .06em;
}

.questboard-feed-icon--xp_earned { background: rgba(19, 185, 126, 0.18); color: #69efbc; }
.questboard-feed-icon--rank_change { background: rgba(255, 193, 85, 0.16); color: #ffd77a; }
.questboard-feed-icon--quest_completed,
.questboard-feed-icon--repeat_claim { background: rgba(41, 112, 255, 0.18); color: #9fc2ff; }

.questboard-feed-copy {
    min-width: 0;
    display: grid;
    gap: 4px;
}

.questboard-feed-copy strong {
    color: #fff;
}

.questboard-feed-copy p {
    margin: 0;
    color: #94a3b7;
    line-height: 1.5;
}

.questboard-feed-meta {
    display: grid;
    justify-items: end;
    gap: 6px;
    text-align: right;
}

.questboard-feed-xp {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 0 10px;
    border-radius: 999px;
    background: rgba(19, 185, 126, 0.16);
    border: 1px solid rgba(19, 185, 126, 0.3);
    color: #7cf0c4;
    font-size: .82rem;
    font-weight: 800;
}

.questboard-feed-meta small {
    color: #7f90a7;
}

.questboard-inbox-tabs {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 16px;
    padding: 6px;
    border: 1px solid #243040;
    border-radius: 999px;
    background: rgba(255,255,255,0.03);
}

.questboard-inbox-tab {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 40px;
    padding: 0 16px;
    border-radius: 999px;
    border: 1px solid transparent;
    background: transparent;
    color: #a3b0c2;
    font-size: .92rem;
    font-weight: 800;
}

.questboard-inbox-tab span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 24px;
    min-height: 24px;
    padding: 0 8px;
    border-radius: 999px;
    background: rgba(255,255,255,0.07);
    color: #fff;
    font-size: .76rem;
}

.questboard-inbox-tab.is-active {
    border-color: rgba(243, 91, 63, 0.42);
    background: rgba(243, 91, 63, 0.13);
    color: #fff;
}

.questboard-inbox-pane[hidden] {
    display: none !important;
}

.questboard-review-list {
    display: grid;
    gap: 12px;
}

.questboard-review-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 14px;
}

.questboard-review-bulk-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 12px;
}

.questboard-review-bulk-form {
    margin: 0;
}

.questboard-review-filter {
    display: inline-flex;
    align-items: center;
    min-height: 38px;
    padding: 0 14px;
    border-radius: 999px;
    border: 1px solid #314051;
    background: rgba(255,255,255,0.03);
    color: #a8b5c8;
    font-size: .84rem;
    font-weight: 800;
}

.questboard-review-filter.is-active,
.questboard-review-filter:hover,
.questboard-review-filter:focus-visible {
    border-color: rgba(243, 91, 63, 0.42);
    background: rgba(243, 91, 63, 0.12);
    color: #fff;
}

.questboard-review-card {
    display: grid;
    gap: 14px;
    padding: 16px;
    border-radius: 18px;
    border: 1px solid #25303d;
    background: #121821;
}

.questboard-review-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.questboard-review-copy {
    min-width: 0;
    display: grid;
    gap: 4px;
}

.questboard-review-copy strong {
    color: #fff;
}

.questboard-review-copy span {
    color: #90a0b6;
    font-size: .88rem;
}

.questboard-review-badge {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 0 10px;
    border-radius: 999px;
    border: 1px solid rgba(243, 91, 63, 0.28);
    background: rgba(243, 91, 63, 0.12);
    color: #ffc3b4;
    font-size: .75rem;
    font-weight: 800;
    white-space: nowrap;
}

.questboard-review-proof {
    display: grid;
    gap: 10px;
}

.questboard-review-proof-row {
    display: grid;
    gap: 6px;
}

.questboard-review-proof-row > span {
    color: #95a4b8;
    font-size: .8rem;
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.questboard-review-proof-row a {
    color: #7eb7ff;
    word-break: break-word;
}

.questboard-review-proof-row p {
    margin: 0;
    color: #e7edf6;
    line-height: 1.6;
    white-space: pre-wrap;
}

.questboard-review-shot {
    display: inline-flex;
    width: 112px;
    height: 112px;
    overflow: hidden;
    border-radius: 16px;
    border: 1px solid #304055;
    background: #0e141d;
}

.questboard-review-shot img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.questboard-review-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: flex-end;
}

.questboard-review-form {
    margin: 0;
}

.questboard-manage-quest-list {
    display: grid;
    gap: 10px;
}

.questboard-manage-quest-row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    padding: 12px;
    border-radius: 14px;
    border: 1px solid #25303d;
    background: #121821;
}

.questboard-manage-quest-check {
    display: flex;
    align-items: center;
    margin: 0;
}

.questboard-manage-quest-copy {
    min-width: 0;
    display: grid;
    gap: 4px;
}

.questboard-manage-quest-copy strong {
    color: #fff;
}

.questboard-manage-quest-copy span {
    color: #96a4b9;
}

.questboard-manage-quest-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: flex-end;
}

.questboard-profile-footer {
    display: grid;
    gap: 14px;
}

.questboard-profile-footer__user {
    display: flex;
    align-items: center;
    gap: 12px;
}

.questboard-profile-avatar {
    width: 48px;
    height: 48px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.08);
    color: #fff;
    font-weight: 900;
}

.questboard-profile-avatar span {
    color: #fff;
}

.questboard-profile-avatar img {
    width: 72%;
    height: 72%;
    object-fit: contain;
    display: block;
}

.questboard-xp-panel {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.questboard-xp-panel > div {
    padding: 12px;
    border-radius: 16px;
    background: #121821;
    border: 1px solid #25303d;
}

.questboard-xp-panel strong {
    display: block;
    margin-bottom: 4px;
    color: #fff;
}

.questboard-level-progress {
    display: grid;
    gap: 8px;
    padding: 12px;
    border-radius: 16px;
    background: #121821;
    border: 1px solid #25303d;
}

.questboard-level-progress__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.questboard-level-progress__head strong,
.questboard-level-progress__head span,
.questboard-level-progress small {
    color: #eef4fb;
}

.questboard-level-progress__head span,
.questboard-level-progress small {
    font-size: .84rem;
    color: #96a4b9;
}

.questboard-level-progress__bar {
    width: 100%;
    height: 10px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(255,255,255,.08);
}

.questboard-level-progress__bar span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #f35b3f, #ffc155);
}

.leaderboard-user-link {
    color: inherit;
    text-decoration: none;
}

.leaderboard-user-link:hover,
.leaderboard-user-link:focus-visible {
    text-decoration: underline;
}

.public-profile-layout .auth-card {
    display: grid;
    gap: 18px;
}

.public-profile-stats {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.public-profile-stats .stack-row strong {
    color: #fff;
    font-size: 1.2rem;
}

.questboard-leave-form {
    margin: -2px 0 0;
}

.questboard-leave-button {
    width: 100%;
    justify-content: center;
}

.questboard-main {
    display: grid;
    gap: 18px;
}

.questboard-group-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.questboard-group-quick-add {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 14px 0 22px;
}

.questboard-group-quick-add input[type="text"] {
    width: min(280px, 100%);
    min-height: 42px;
    padding: 0 14px;
    border-radius: 999px;
    border: 1px solid #303949;
    background: #171d26;
    color: #eef4fb;
    font-weight: 700;
}

.questboard-group-quick-add .button {
    min-height: 42px;
    border-radius: 999px;
    padding-inline: 16px;
}

.questboard-group-tab {
    display: inline-flex;
    align-items: center;
    min-height: 40px;
    padding: 0 14px;
    border-radius: 999px;
    border: 1px solid #303949;
    background: #171d26;
    color: #eef4fb;
    font-weight: 800;
}

.questboard-group-tab--draggable,
.questboard-group-section--draggable {
    cursor: grab;
}

.questboard-group-tab--draggable.is-dragging,
.questboard-group-section--draggable.is-dragging {
    opacity: 0.72;
    cursor: grabbing;
}

.questboard-sort-form--groups {
    margin-top: -6px;
}

.questboard-section-stack {
    margin-top: 0;
}

.questboard-group-section {
    display: grid;
    gap: 18px;
}

.questboard-group-hero {
    padding: 22px 24px;
    border-radius: 24px;
    border: 1px solid rgba(255,255,255,0.08);
    background:
        radial-gradient(circle at 18% 20%, rgba(255,255,255,0.16), transparent 28%),
        linear-gradient(110deg, rgba(71,76,255,0.92), rgba(197,37,170,0.86));
}

.questboard-group-hero.cat-social {
    background:
        radial-gradient(circle at 18% 20%, rgba(255,255,255,0.16), transparent 28%),
        linear-gradient(110deg, rgba(10,91,74,0.94), rgba(16,220,142,0.42));
}

.questboard-group-hero.cat-discord {
    background:
        radial-gradient(circle at 18% 20%, rgba(255,255,255,0.14), transparent 28%),
        linear-gradient(110deg, rgba(80,24,23,0.94), rgba(255,96,56,0.48));
}

.questboard-group-hero.cat-visit {
    background:
        radial-gradient(circle at 18% 20%, rgba(255,255,255,0.14), transparent 28%),
        linear-gradient(110deg, rgba(96,82,19,0.92), rgba(241,196,15,0.42));
}

.questboard-group-hero.cat-wallet {
    background:
        radial-gradient(circle at 18% 20%, rgba(255,255,255,0.14), transparent 28%),
        linear-gradient(110deg, rgba(11,56,74,0.94), rgba(0,184,255,0.38));
}

.questboard-group-hero.cat-reward {
    background:
        radial-gradient(circle at 18% 20%, rgba(255,255,255,0.14), transparent 28%),
        linear-gradient(110deg, rgba(88,23,88,0.92), rgba(255,62,231,0.36));
}

.questboard-group-hero__copy {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 18px;
}

.questboard-group-hero__copy h2,
.questboard-group-hero__copy span {
    color: #fff;
    margin: 0;
}

.questboard-group-progress {
    height: 10px;
    border-radius: 999px;
    background: rgba(255,255,255,0.15);
    overflow: hidden;
}

.questboard-group-progress span {
    display: block;
    height: 100%;
    border-radius: 999px;
    background: rgba(255,255,255,0.45);
}

.questboard-card-grid {
    grid-template-columns: repeat(auto-fill, 350px);
    justify-content: start;
}

.crew3-topbar,
.crew3-utility {
    display: grid;
    gap: 18px;
}

.crew3-topbar {
    grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
    align-items: start;
    margin-bottom: 22px;
}

.crew3-hero-card {
    padding: 18px 20px;
    border: 1px solid #242d39;
    border-radius: 18px;
    background: linear-gradient(180deg, rgba(255,255,255,0.03), rgba(255,255,255,0.01));
}

.crew3-hero-brand {
    display: grid;
    grid-template-columns: 164px minmax(0, 1fr);
    gap: 24px;
    align-items: start;
}

.crew3-hero-logo {
    width: 164px;
    height: 164px;
    border-radius: 22px;
    border: 1px solid #283240;
    background: linear-gradient(135deg, rgba(243,91,63,0.95), rgba(255,193,85,0.72));
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.crew3-hero-logo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.crew3-hero-logo span {
    font-size: 4rem;
    font-weight: 900;
    color: #fff;
}

.crew3-hero-title-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 8px;
}

.crew3-hero-tag {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 0 12px;
    border-radius: 999px;
    border: 1px solid #344053;
    color: #dbe7ff;
    background: rgba(255,255,255,0.04);
    font-size: 0.84rem;
    font-weight: 800;
}

.crew3-social-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 16px;
}

.crew3-social-link {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-height: 42px;
    padding: 0 14px;
    border-radius: 999px;
    border: 1px solid #2e3948;
    background: #10161d;
    color: #eef4fb;
}

.crew3-social-link span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    border-radius: 999px;
    background: rgba(255,255,255,0.06);
    color: #9dafc3;
    font-size: 0.72rem;
    font-weight: 800;
}

.crew3-social-link strong {
    font-size: 0.86rem;
}

.crew3-campaign h1 {
    margin: 0 0 8px;
    font-size: clamp(2rem, 4vw, 3.4rem);
    line-height: 1.03;
}

.crew3-campaign p:last-child {
    margin: 0;
    max-width: 70ch;
    color: #97a3b6;
}

.crew3-summary {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.crew3-mini-stat,
.crew3-panel {
    background: var(--campaign-surface);
    border: 1px solid #242d39;
    border-radius: 12px;
    padding: 16px 18px;
}

.crew3-mini-stat strong {
    display: block;
    color: #f7fbff;
    font-size: 1.12rem;
    margin-bottom: 6px;
}

.crew3-mini-stat span,
.crew3-panel-stack span,
.crew3-rank-item span,
.crew3-panel p {
    color: #97a3b6;
}

.crew3-filter-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.crew3-filter {
    padding: 8px 12px;
    border: 1px solid #313846;
    border-radius: 999px;
    color: #9dafc3;
    font-weight: 700;
    background: #121821;
}

.crew3-filter.is-active {
    color: #fff;
    border-color: #4f5968;
    background: rgba(255, 255, 255, 0.07);
}

.crew3-sidepanels {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.crew3-panel-stack,
.crew3-rank-list {
    display: grid;
    gap: 10px;
}

.crew3-rank-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding-bottom: 10px;
    border-bottom: 1px solid #26303c;
}

.crew3-rank-item:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.crew3-banner-strip {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
    margin-bottom: 16px;
    padding: 12px 16px;
    border-radius: 12px;
    border: 1px solid #2a3441;
    background: rgba(255,255,255,0.03);
}

.muted-strip {
    color: #9dafc3;
}

.crew3-sections {
    display: grid;
    gap: 34px;
    margin-top: 28px;
}

.crew3-category-title {
    margin: 0 0 14px;
    font-size: 1.05rem;
    font-weight: 900;
    letter-spacing: -0.02em;
}

.crew3-card-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, 350px);
    gap: 18px;
    justify-content: start;
}

.crew3-quest-card {
    --quest-card-bg: #171d26;
    --quest-card-border: #313948;
    --quest-menu-bg: rgba(20, 27, 37, 0.94);
    --quest-menu-border: rgba(255,255,255,0.1);
    position: relative;
    width: 350px;
    min-width: 350px;
    height: 300px;
    min-height: 300px;
    max-height: 300px;
    max-width: 350px;
    background: var(--quest-card-bg);
    border: 1px solid var(--quest-card-border);
    border-radius: 18px;
    box-shadow: none;
    overflow: hidden;
}

.crew3-quest-card[data-quest-sort-card] {
    cursor: grab;
}

.crew3-quest-card[data-quest-sort-card].is-dragging {
    opacity: 0.72;
    transform: scale(0.986);
    box-shadow: 0 18px 38px rgba(0,0,0,0.28);
    cursor: grabbing;
}

.questboard-sort-form {
    display: none;
    margin: 0;
}

.questboard-sort-status {
    color: #8ea1b8;
    font-size: 0.84rem;
    font-weight: 700;
}

.crew3-card-menu {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 3;
}

.crew3-card-menu__trigger {
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 0;
    border-radius: 12px;
    border: 1px solid var(--quest-menu-border);
    background: linear-gradient(180deg, rgba(255,255,255,0.05), rgba(255,255,255,0.01)), var(--quest-menu-bg);
    color: #eef4fb;
    cursor: pointer;
    box-shadow: 0 10px 22px rgba(0,0,0,0.22);
    transition: transform 120ms ease, border-color 120ms ease, box-shadow 120ms ease;
}

.crew3-card-menu__trigger:hover,
.crew3-card-menu__trigger:focus-visible {
    transform: translateY(-1px);
    border-color: rgba(255,255,255,0.2);
    box-shadow: 0 14px 28px rgba(0,0,0,0.28);
}

.crew3-card-menu__trigger span {
    width: 4px;
    height: 4px;
    border-radius: 999px;
    background: rgba(238, 244, 251, 0.92);
    flex: 0 0 auto;
}

.crew3-card-menu__panel {
    position: absolute;
    top: 46px;
    right: 0;
    min-width: 128px;
    padding: 8px;
    border-radius: 14px;
    border: 1px solid #334052;
    background: #111821;
    box-shadow: 0 16px 34px rgba(0,0,0,0.28);
    display: grid;
    gap: 6px;
}

.crew3-card-menu__panel[hidden] {
    display: none !important;
}

.crew3-card-menu__panel form {
    margin: 0;
}

.crew3-card-menu__action {
    width: 100%;
    min-height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    padding: 0 10px;
    border-radius: 10px;
    border: 1px solid #334052;
    background: rgba(255,255,255,0.03);
    color: #eef4fb;
    font: inherit;
    font-weight: 700;
    cursor: pointer;
}

.crew3-card-menu__action.is-danger {
    border-color: rgba(255, 95, 95, 0.28);
    color: #ff8e8e;
}

.crew3-quest-card--completed {
    opacity: 0.58;
    filter: saturate(0.7);
}

.crew3-quest-card--completed .button,
.crew3-quest-card--completed a,
.crew3-quest-card--completed input,
.crew3-quest-card--completed textarea,
.crew3-quest-card--completed select {
    pointer-events: none;
}

.crew3-add-card {
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #313948;
    background: #0f141c;
    cursor: pointer;
    transition: border-color 0.18s ease, transform 0.18s ease, background 0.18s ease;
}

.crew3-add-card:hover,
.crew3-add-card:focus-visible {
    border-color: #4d5a6d;
    background: #131a24;
    transform: translateY(-1px);
}

.crew3-add-card__plus {
    color: #66758a;
    font-size: 3rem;
    line-height: 1;
    font-weight: 300;
}

.template-card-row--modal {
    grid-template-columns: repeat(auto-fill, minmax(100px, 100px));
    justify-content: start;
}

#campaign-template-picker-modal .launch-builder-modal__dialog {
    width: min(900px, 100%);
    height: min(620px, calc(100vh - 32px));
    max-height: calc(100vh - 32px);
}

#campaign-template-picker-modal .launch-builder-modal__content {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
}

#campaign-template-picker-modal .launch-builder-modal__body {
    display: block;
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding-right: 12px;
}

.crew3-card-inner {
    height: 100%;
    display: flex;
    flex-direction: column;
    padding: 18px 18px 14px;
}

.crew3-quest-card h3 {
    margin: 0 0 10px;
    color: #ffffff;
    font-size: 1rem;
    line-height: 1.25;
}

.crew3-quest-card p {
    margin: 0;
    color: #f1f5fb;
    line-height: 1.48;
    font-size: 0.95rem;
}

.crew3-quest-card p strong {
    color: #ffffff;
    font-size: 0.78rem;
    letter-spacing: 0.04em;
}

.crew3-task-link {
    margin-top: 8px !important;
}

.crew3-task-link a {
    color: #dbe7ff;
    text-decoration: underline;
}

.crew3-meta-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 10px;
}

.crew3-meta-pill {
    display: inline-flex;
    align-items: center;
    padding: 4px 8px;
    border-radius: 999px;
    border: 1px solid rgba(255,255,255,0.1);
    background: rgba(255,255,255,0.04);
    color: #b4c0d1;
    font-size: 0.74rem;
    font-weight: 700;
}

.crew3-proof-form {
    display: grid;
    gap: 8px;
    margin-top: 14px;
}

.crew3-proof-form.compact {
    margin-top: 0;
    display: inline-flex;
    align-items: center;
    width: auto;
}

.crew3-proof-form input,
.crew3-proof-form textarea {
    background: #0d1117;
    border: 1px solid #333d4d;
    color: #eef4fb;
    border-radius: 4px;
    padding: 10px 11px;
}

.crew3-proof-form input::placeholder,
.crew3-proof-form textarea::placeholder {
    color: #7f8da0;
}

.crew3-submit {
    min-height: 38px;
    border-radius: 10px;
    padding: 0 14px;
    font-size: 0.9rem;
}

.crew3-submit--verify {
    width: 70px;
    min-width: 70px;
    height: 35px;
    min-height: 35px;
    padding: 0 10px;
}

.crew3-action-row {
    display: flex;
    gap: 10px;
    align-items: center;
    margin-top: 14px;
}

.questboard-invite-helper {
    display: grid;
    gap: 5px;
    margin-top: 12px;
    padding: 12px 13px;
    border-radius: 12px;
    border: 1px solid rgba(96, 165, 250, 0.24);
    background: rgba(15, 23, 42, 0.78);
}

.questboard-invite-helper strong {
    color: #f8fafc;
    font-size: 0.85rem;
}

.questboard-invite-helper span {
    color: #94a3b8;
    font-size: 0.76rem;
    line-height: 1.45;
}

.questboard-invite-modal-box {
    display: grid;
    gap: 10px;
    margin-top: 14px;
    padding: 14px;
    border-radius: 14px;
    border: 1px solid rgba(96, 165, 250, 0.24);
    background: rgba(15, 23, 42, 0.82);
}

.questboard-invite-modal-box strong {
    color: #f8fafc;
    font-size: 0.9rem;
}

.questboard-invite-modal-box p {
    margin: 0;
    color: #94a3b8;
    font-size: 0.82rem;
    line-height: 1.55;
}

.questboard-invite-copy-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
}

.questboard-invite-copy-row input {
    width: 100%;
    background: #0d1117;
    border: 1px solid #334155;
    border-radius: 10px;
    color: #dbeafe;
    padding: 10px 12px;
    font-size: 0.8rem;
}

.crew3-detail-button {
    min-height: 38px;
    border-radius: 10px;
    padding: 0 14px;
    border: 1px solid #4a5568;
    background: rgba(255,255,255,0.03);
    color: #eef4fb;
}

.crew3-card-status,
.crew3-login-hint {
    margin-top: 10px;
}

.crew3-card-status span {
    display: inline-block;
    margin-bottom: 6px;
    color: #ffffff;
    font-size: 0.78rem;
    font-weight: 800;
}

.crew3-card-status small {
    display: block;
    color: #94a3b8;
}

.crew3-card-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: auto;
    padding-top: 12px;
}

.quest-modal[hidden] {
    display: none;
}

.quest-modal {
    position: fixed;
    inset: 0;
    z-index: 60;
}

.quest-modal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.72);
}

.quest-modal__dialog {
    position: relative;
    z-index: 1;
    width: min(720px, calc(100% - 32px));
    margin: 6vh auto 0;
    padding: 22px;
    border-radius: 14px;
    background: #121821;
    border: 1px solid #2c3644;
    box-shadow: 0 24px 80px rgba(0, 0, 0, 0.45);
}

.quest-modal__close {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 36px;
    height: 36px;
    border-radius: 999px;
    border: 1px solid #404a59;
    background: #0d1117;
    color: #fff;
    cursor: pointer;
    font-size: 1.25rem;
}

.quest-modal__content {
    display: grid;
    gap: 14px;
}

.quest-modal__content h3 {
    margin: 0;
    font-size: 1.55rem;
}

.quest-modal__description,
.quest-modal__hint {
    margin: 0;
    color: #b4c0d1;
    line-height: 1.6;
}

.quest-modal__hint--gated {
    color: #ffb8a6;
}

.quest-modal__history {
    display: grid;
    gap: 10px;
    padding: 12px 14px;
    border-radius: 12px;
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(255,255,255,0.08);
}

.quest-modal__history-list {
    display: grid;
    gap: 8px;
}

.quest-modal__history-row {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    color: #b4c0d1;
    font-size: 0.9rem;
}

body.modal-open {
    overflow: hidden;
}

.crew3-xp-badge,
.crew3-once-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 28px;
    padding: 0 10px;
    border-radius: 10px;
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.04em;
}

.crew3-once-badge {
    color: #ffffff;
    border: 1px solid rgba(255,255,255,0.75);
    background: transparent;
}

.cat-discord {
    color: #ff6038;
}

.cat-discord.crew3-quest-card {
    --quest-card-bg: rgba(34, 23, 24, 0.9);
    --quest-card-border: rgba(255, 96, 56, 0.45);
    --quest-menu-bg: rgba(34, 23, 24, 0.96);
    --quest-menu-border: rgba(255, 96, 56, 0.18);
}

.cat-discord .crew3-xp-badge {
    color: #ff6038;
    border: 1px solid rgba(255, 96, 56, 0.75);
    background: rgba(255, 96, 56, 0.08);
}

.cat-invite {
    color: #28a5ff;
}

.cat-invite.crew3-quest-card {
    --quest-card-bg: rgba(11, 25, 39, 0.88);
    --quest-card-border: rgba(40, 165, 255, 0.42);
    --quest-menu-bg: rgba(11, 25, 39, 0.96);
    --quest-menu-border: rgba(40, 165, 255, 0.18);
}

.cat-invite .crew3-xp-badge {
    color: #28a5ff;
    border: 1px solid rgba(40, 165, 255, 0.76);
    background: rgba(40, 165, 255, 0.08);
}

.cat-daily {
    color: #8d69ff;
}

.cat-daily.crew3-quest-card {
    --quest-card-bg: rgba(24, 23, 43, 0.9);
    --quest-card-border: rgba(141, 105, 255, 0.42);
    --quest-menu-bg: rgba(24, 23, 43, 0.96);
    --quest-menu-border: rgba(141, 105, 255, 0.18);
}

.cat-daily .crew3-xp-badge {
    color: #8d69ff;
    border: 1px solid rgba(141, 105, 255, 0.72);
    background: rgba(141, 105, 255, 0.08);
}

.cat-visit {
    color: #f1c40f;
}

.cat-visit.crew3-quest-card {
    --quest-card-bg: rgba(35, 34, 20, 0.9);
    --quest-card-border: rgba(241, 196, 15, 0.42);
    --quest-menu-bg: rgba(35, 34, 20, 0.96);
    --quest-menu-border: rgba(241, 196, 15, 0.18);
}

.cat-visit .crew3-xp-badge {
    color: #f1c40f;
    border: 1px solid rgba(241, 196, 15, 0.76);
    background: rgba(241, 196, 15, 0.08);
}

.cat-wallet {
    color: #0fc7ff;
}

.cat-wallet.crew3-quest-card {
    --quest-card-bg: rgba(8, 34, 41, 0.92);
    --quest-card-border: rgba(15, 199, 255, 0.42);
    --quest-menu-bg: rgba(8, 34, 41, 0.97);
    --quest-menu-border: rgba(15, 199, 255, 0.18);
}

.cat-wallet .crew3-xp-badge {
    color: #0fc7ff;
    border: 1px solid rgba(15, 199, 255, 0.76);
    background: rgba(15, 199, 255, 0.08);
}

.cat-reward {
    color: #ff3ee7;
}

.cat-reward.crew3-quest-card {
    --quest-card-bg: rgba(36, 18, 35, 0.92);
    --quest-card-border: rgba(255, 62, 231, 0.42);
    --quest-menu-bg: rgba(36, 18, 35, 0.97);
    --quest-menu-border: rgba(255, 62, 231, 0.18);
}

.cat-reward .crew3-xp-badge {
    color: #ff3ee7;
    border: 1px solid rgba(255, 62, 231, 0.76);
    background: rgba(255, 62, 231, 0.08);
}

.cat-social {
    color: #10dc8e;
}

.cat-social.crew3-quest-card {
    --quest-card-bg: rgba(11, 33, 28, 0.92);
    --quest-card-border: rgba(16, 220, 142, 0.42);
    --quest-menu-bg: rgba(11, 33, 28, 0.97);
    --quest-menu-border: rgba(16, 220, 142, 0.18);
}

.cat-social .crew3-xp-badge {
    color: #10dc8e;
    border: 1px solid rgba(16, 220, 142, 0.76);
    background: rgba(16, 220, 142, 0.08);
}

@media (max-width: 1100px) {
    .hero, .split-section, .dashboard, .admin-grid, .profile-layout, .card-grid.two, .card-grid.three, .card-grid.five, .stat-grid.four, .showcase-grid, .footer-grid, .docs-grid, .docs-layout {
        grid-template-columns: 1fr;
    }

    .questboard-layout {
        grid-template-columns: 64px minmax(0, 1fr);
    }

    .questboard-layout--no-rail {
        grid-template-columns: minmax(0, 1fr);
    }

    .questboard-sidepanel {
        grid-column: 1 / -1;
        position: static;
    }

    .template-card-row {
        grid-template-columns: 1fr 1fr;
    }

    .crew3-topbar,
    .crew3-sidepanels,
    .crew3-card-grid {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 720px) {
    .topbar, .topnav, .top-actions, .card-row, .button-row, .section-head, .hero-actions, .leader-item {
        flex-direction: column;
        align-items: flex-start;
    }

    .form-grid, .mini-grid {
        grid-template-columns: 1fr;
    }

    .template-card-row,
    .group-board,
    .questboard-layout,
    .questboard-card-grid,
    .questboard-xp-panel {
        grid-template-columns: 1fr;
    }

    .questboard-campaign-rail {
        position: static;
        grid-auto-flow: column;
        grid-auto-columns: 52px;
        overflow-x: auto;
    }

    .hero h1 {
        max-width: none;
    }

    .showcase-brand-copy h3 {
        font-size: 1.25rem;
    }

    .crew3-summary,
    .crew3-topbar,
    .crew3-sidepanels,
    .crew3-card-grid {
        grid-template-columns: 1fr;
    }

    .template-strip-head,
    .template-helper-card {
        flex-direction: column;
        align-items: flex-start;
    }

    .crew3-hero-brand {
        grid-template-columns: 1fr;
    }

    .crew3-hero-logo {
        width: 120px;
        height: 120px;
    }

    .crew3-action-row {
        flex-direction: column;
        align-items: stretch;
    }
}