:root {
  --qbb-maroon: #7a1434;
  --qbb-maroon-dark: #4d0b22;
  --qbb-ink: #1b171d;
  --qbb-pearl: #fbfafb;
  --qbb-blush: #f6edf1;
  --qbb-line: #eadde3;
  --qbb-muted: #645a62;
  --qbb-soft: #8c7f88;
  --bs-primary: var(--qbb-maroon);
  --bs-primary-rgb: 122, 20, 52;
  --bs-body-bg: var(--qbb-pearl);
  --bs-body-color: var(--qbb-ink);
  --bs-border-color: var(--qbb-line);
  --bs-link-color: var(--qbb-maroon);
  --bs-link-hover-color: var(--qbb-maroon-dark);
  --bs-body-font-family: "Montserrat", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

[data-bs-theme="dark"] {
  --qbb-maroon: #f3d8e1;
  --qbb-maroon-dark: #f0c0d0;
  --qbb-ink: #f7f2f5;
  --qbb-pearl: #1b171d;
  --qbb-blush: #2a2028;
  --qbb-line: rgba(255, 255, 255, 0.12);
  --qbb-muted: rgba(255, 255, 255, 0.72);
  --qbb-soft: rgba(255, 255, 255, 0.52);
  --bs-body-bg: var(--qbb-pearl);
  --bs-body-color: var(--qbb-ink);
  --bs-border-color: var(--qbb-line);
  --bs-link-color: var(--qbb-maroon);
  --bs-link-hover-color: #ffffff;
}

html,
body {
  letter-spacing: 0;
}

body {
  background: var(--qbb-pearl);
  color: var(--qbb-ink);
  font-family: var(--bs-body-font-family);
}

h1,
h2,
h3,
h4,
h5,
h6,
.navbar-brand,
.challenge-inner p {
  font-family: "Sora", "Montserrat", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  letter-spacing: 0;
}

a {
  color: var(--qbb-maroon);
}

a:hover {
  color: var(--qbb-maroon-dark);
}

.navbar.navbar-dark.bg-dark {
  background: color-mix(in srgb, var(--qbb-pearl) 94%, transparent) !important;
  border-bottom: 1px solid var(--qbb-line);
  box-shadow: 0 10px 28px rgba(77, 11, 34, 0.07);
  min-height: 5rem;
}

.navbar.navbar-dark.bg-dark::before {
  background: var(--qbb-maroon);
  content: "";
  height: 3px;
  inset: 0 0 auto;
  position: absolute;
}

.navbar .container {
  min-height: 4.75rem;
}

.navbar-dark .navbar-brand,
.navbar-dark .navbar-nav .nav-link,
.navbar-dark .navbar-nav .nav-link.active,
.navbar-dark .navbar-nav .show > .nav-link {
  color: var(--qbb-ink);
}

.navbar-dark .navbar-brand {
  color: var(--qbb-maroon) !important;
  font-weight: 800;
}

.navbar-dark .navbar-brand .ctf_logo {
  height: 2.4rem !important;
  max-height: 2.4rem;
  object-fit: contain;
}

.navbar-dark .navbar-nav .nav-link {
  border-radius: 0.375rem;
  color: var(--qbb-muted);
  font-size: 0.94rem;
  font-weight: 600;
  padding-inline: 0.7rem;
}

.navbar-dark .navbar-nav .nav-link:hover,
.navbar-dark .navbar-nav .nav-link:focus,
.navbar-dark .navbar-nav .nav-link[aria-expanded="true"] {
  background: var(--qbb-blush);
  color: var(--qbb-maroon-dark);
}

.navbar-dark .navbar-toggler {
  border-color: var(--qbb-line);
}

.navbar-dark .navbar-toggler-icon {
  filter: invert(1);
}

[data-bs-theme="dark"] .navbar-dark .navbar-toggler-icon {
  filter: none;
}

main {
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--qbb-blush) 45%, transparent), transparent 18rem),
    var(--qbb-pearl);
  min-height: calc(100vh - 5rem);
}

.jumbotron {
  background: transparent;
  border-bottom: 1px solid var(--qbb-line);
  margin-bottom: 2rem;
  padding: 7rem 0 2.5rem;
}

.jumbotron h1 {
  color: var(--qbb-ink);
  font-size: clamp(2.5rem, 6vw, 5.6rem);
  font-weight: 700;
  line-height: 1.04;
}

.jumbotron h1::before {
  color: var(--qbb-soft);
  content: "QBB CTF";
  display: block;
  font-family: var(--bs-body-font-family);
  font-size: 0.78rem;
  font-weight: 700;
  margin-bottom: 0.85rem;
  text-transform: uppercase;
}

.container {
  max-width: 1280px;
}

.btn {
  border-radius: 0.375rem;
  font-weight: 700;
}

.btn-primary,
.btn-primary:disabled {
  background: var(--qbb-maroon);
  border-color: var(--qbb-maroon);
  color: #ffffff;
}

.btn-primary:hover,
.btn-primary:focus {
  background: var(--qbb-maroon-dark);
  border-color: var(--qbb-maroon-dark);
  color: #ffffff;
}

.btn-dark {
  background: var(--qbb-ink);
  border-color: var(--qbb-ink);
  color: #ffffff;
}

.btn-outline-secondary {
  border-color: color-mix(in srgb, var(--qbb-maroon) 40%, transparent);
  color: var(--qbb-maroon-dark);
}

.btn-outline-secondary:hover,
.btn-outline-secondary:focus {
  background: var(--qbb-maroon);
  border-color: var(--qbb-maroon);
  color: #ffffff;
}

.form-control,
.form-select {
  background-color: color-mix(in srgb, var(--qbb-pearl) 88%, #ffffff);
  border-color: var(--qbb-line);
  border-radius: 0.375rem;
  color: var(--qbb-ink);
}

.form-control:focus,
.form-select:focus {
  border-color: var(--qbb-maroon);
  box-shadow: 0 0 0 0.2rem color-mix(in srgb, var(--qbb-maroon) 18%, transparent);
}

.card,
.modal-content,
.dropdown-menu {
  border-color: var(--qbb-line);
  border-radius: 0.5rem;
  box-shadow: 0 18px 44px rgba(77, 11, 34, 0.08);
}

.table {
  --bs-table-bg: transparent;
  --bs-table-striped-bg: color-mix(in srgb, var(--qbb-blush) 50%, transparent);
  --bs-table-hover-bg: color-mix(in srgb, var(--qbb-blush) 70%, transparent);
  border-color: var(--qbb-line);
}

.table thead th {
  color: var(--qbb-soft);
  font-size: 0.78rem;
  text-transform: uppercase;
}

.category-header h3 {
  color: var(--qbb-ink);
  font-weight: 700;
}

.challenge-button {
  background: color-mix(in srgb, var(--qbb-pearl) 90%, #ffffff) !important;
  border: 1px solid var(--qbb-line) !important;
  border-radius: 0.5rem;
  box-shadow: none !important;
  color: var(--qbb-ink) !important;
  min-height: 8.5rem;
  transition: border-color 150ms ease, box-shadow 150ms ease, transform 150ms ease;
}

.challenge-button:hover,
.challenge-button:focus {
  border-color: color-mix(in srgb, var(--qbb-maroon) 45%, var(--qbb-line)) !important;
  box-shadow: 0 16px 34px rgba(77, 11, 34, 0.12) !important;
  transform: translateY(-1px);
}

.challenge-button.challenge-solved {
  background: #eef8f0 !important;
  border-color: #9fd2a6 !important;
  color: #14532d !important;
}

[data-bs-theme="dark"] .challenge-button.challenge-solved {
  background: #17351d !important;
  border-color: #2f6d3b !important;
  color: #d8f5de !important;
}

.challenge-inner p {
  font-size: 1rem;
  font-weight: 700;
  margin-bottom: 0.75rem;
}

.challenge-inner span {
  color: var(--qbb-maroon);
  font-size: 1.35rem;
  font-weight: 800;
}

.badge.bg-info,
.challenge-tag {
  background: var(--qbb-blush) !important;
  color: var(--qbb-maroon-dark);
}

.footer {
  background: var(--qbb-pearl);
  border-top: 1px solid var(--qbb-line);
  padding: 1.5rem 0;
}

.footer a,
.footer small {
  color: var(--qbb-muted) !important;
}

@media (max-width: 767.98px) {
  .navbar.navbar-dark.bg-dark {
    min-height: 4.25rem;
  }

  .navbar .container {
    min-height: 4rem;
  }

  .jumbotron {
    padding-top: 6rem;
  }
}

/* QBB CTF is intentionally light-only. If CTFd sets data-bs-theme="dark",
   keep the same white palette and hide the bundled theme switcher. */
:root,
[data-bs-theme="dark"] {
  color-scheme: light;
  --qbb-maroon: #7a1434;
  --qbb-maroon-dark: #4d0b22;
  --qbb-ink: #1b171d;
  --qbb-pearl: #fbfafb;
  --qbb-blush: #f6edf1;
  --qbb-line: #eadde3;
  --qbb-muted: #645a62;
  --qbb-soft: #8c7f88;
  --bs-primary: var(--qbb-maroon);
  --bs-primary-rgb: 122, 20, 52;
  --bs-body-bg: var(--qbb-pearl);
  --bs-body-color: var(--qbb-ink);
  --bs-emphasis-color: var(--qbb-ink);
  --bs-secondary-color: var(--qbb-muted);
  --bs-secondary-bg: var(--qbb-blush);
  --bs-tertiary-bg: var(--qbb-pearl);
  --bs-border-color: var(--qbb-line);
  --bs-link-color: var(--qbb-maroon);
  --bs-link-hover-color: var(--qbb-maroon-dark);
}

.theme-switch {
  display: none !important;
}

[data-bs-theme="dark"] body,
[data-bs-theme="dark"] main,
[data-bs-theme="dark"] .card,
[data-bs-theme="dark"] .modal-content,
[data-bs-theme="dark"] .dropdown-menu,
[data-bs-theme="dark"] .form-control,
[data-bs-theme="dark"] .form-select {
  background-color: var(--qbb-pearl);
  color: var(--qbb-ink);
}

[data-bs-theme="dark"] .navbar-dark .navbar-toggler-icon {
  filter: invert(1);
}

[data-bs-theme="dark"] .challenge-button.challenge-solved {
  background: #eef8f0 !important;
  border-color: #9fd2a6 !important;
  color: #14532d !important;
}

[data-bs-theme="dark"] .btn-close {
  filter: none;
}

/* Beat CTFd theme-header jumbotron color injection and keep page headers white. */
body main {
  padding-top: 5rem;
}

body main > .jumbotron,
html[data-bs-theme="dark"] body main > .jumbotron {
  background: var(--qbb-pearl) !important;
  background-color: var(--qbb-pearl) !important;
  border-bottom: 1px solid var(--qbb-line);
  color: var(--qbb-ink) !important;
  margin-bottom: 2rem;
  padding: 2.5rem 0 2rem;
  text-align: center;
}

body main > .jumbotron h1,
html[data-bs-theme="dark"] body main > .jumbotron h1 {
  color: var(--qbb-ink) !important;
  font-size: clamp(2.25rem, 4vw, 3.75rem);
  line-height: 1.04;
}

body main > .jumbotron h1::before,
html[data-bs-theme="dark"] body main > .jumbotron h1::before {
  color: var(--qbb-soft) !important;
}

@media (max-width: 767.98px) {
  body main {
    padding-top: 4.25rem;
  }

  body main > .jumbotron,
  html[data-bs-theme="dark"] body main > .jumbotron {
    padding: 2rem 0 1.5rem;
  }
}

/* Index page content block used by the CTFd index page. */
.qbb-index {
  min-height: calc(100vh - 10rem);
  display: grid;
  place-items: center;
  padding: 3rem 1rem;
  background: var(--qbb-pearl);
  color: var(--qbb-ink);
}

.qbb-index__inner {
  width: min(100%, 680px);
  text-align: center;
}

.qbb-index__logo {
  width: 5.25rem;
  height: 5.25rem;
  object-fit: contain;
  margin-bottom: 1.25rem;
}

.qbb-index__eyebrow {
  margin-bottom: 0.75rem;
  color: var(--qbb-soft);
  font-size: 1rem !important;
  font-weight: 700;
  text-transform: uppercase;
}

.qbb-index h1 {
  max-width: 560px;
  margin: 0 auto;
  color: var(--qbb-ink);
  font-size: clamp(2rem, 4vw, 3.25rem) !important;
  font-weight: 800;
  line-height: 1.08;
}

.qbb-index__text {
  max-width: 520px;
  margin: 1.1rem auto 0;
  color: var(--qbb-muted);
  font-size: clamp(1rem, 1.5vw, 1.15rem) !important;
  line-height: 1.65;
}

.qbb-index__actions,
.qbb-index__social {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.75rem;
}

.qbb-index__actions {
  margin-top: 1.65rem;
}

.qbb-index__social {
  margin-top: 1.65rem;
}

.qbb-index__button,
.qbb-index__social a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.375rem;
  font-weight: 700;
  text-decoration: none;
}

.qbb-index__button {
  min-height: 2.75rem;
  padding: 0.65rem 1.1rem;
  font-size: 0.95rem !important;
}

.qbb-index__button--primary {
  background: var(--qbb-maroon);
  color: #ffffff;
}

.qbb-index__button--primary:hover {
  background: var(--qbb-maroon-dark);
  color: #ffffff;
}

.qbb-index__button--secondary {
  border: 1px solid rgba(122, 20, 52, 0.35);
  color: var(--qbb-maroon-dark);
}

.qbb-index__button--secondary:hover {
  background: var(--qbb-blush);
  color: var(--qbb-maroon-dark);
}

.qbb-index__social a {
  width: 2.45rem;
  height: 2.45rem;
  font-size: 0.95rem !important;
  border: 1px solid var(--qbb-line);
  background: #ffffff;
  color: var(--qbb-muted);
}

.qbb-index__social a:hover {
  border-color: rgba(122, 20, 52, 0.4);
  background: var(--qbb-blush);
  color: var(--qbb-maroon-dark);
}


.qbb-index__site {
  margin-top: 1.25rem;
  color: var(--qbb-muted);
  font-size: 0.9rem !important;
  line-height: 1.5;
}

.qbb-index__site a {
  color: var(--qbb-maroon);
  font-weight: 700;
  text-decoration: none;
}

.qbb-index__site a:hover {
  color: var(--qbb-maroon-dark);
  text-decoration: underline;
  text-underline-offset: 0.18em;
}


/* CCQ competition index variant: no inline styles or absolute positioning needed. */
.qbb-index--ccq {
  min-height: calc(100vh - 9rem);
  padding: clamp(2.5rem, 5vw, 4.25rem) 1rem;
}

.qbb-index--ccq .qbb-index__inner {
  width: min(100%, 880px);
}

.qbb-index__logos {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: clamp(1.25rem, 4vw, 3rem);
  margin: 0 auto 2rem;
}

.qbb-index__logos .qbb-index__logo {
  width: auto;
  height: auto;
  margin: 0;
  object-fit: contain;
}

.qbb-index__logo--qbb {
  max-width: min(42vw, 14.5rem);
  max-height: 10rem;
}

.qbb-index__logo--partner {
  max-width: min(42vw, 15.5rem);
  max-height: 7.5rem;
}

.qbb-index__title {
  max-width: 760px;
  margin: 0 auto;
  color: var(--qbb-ink);
  font-size: clamp(2rem, 3.4vw, 3.25rem) !important;
  font-weight: 800;
  line-height: 1.1;
}

.qbb-index__title-line {
  display: block;
}

.qbb-index--ccq .qbb-index__text {
  max-width: 720px;
}

.qbb-index--ccq .qbb-index__site {
  margin-top: 1rem;
  font-size: 1rem !important;
}

@media (max-width: 640px) {
  .qbb-index__logos {
    gap: 1rem;
    margin-bottom: 1.5rem;
  }

  .qbb-index__logo--qbb,
  .qbb-index__logo--partner {
    max-width: min(78vw, 12rem);
  }

  .qbb-index__title {
    font-size: clamp(1.75rem, 9vw, 2.4rem) !important;
  }
}