/* RPCTF / Red Phoenix: old-school hacker underground theme for CTFd 3.8
   Dark only. Layered over CTFd core (Bootstrap 5.3 + Alpine.js).

   Palette roles
     crimson  = Red Phoenix signature, primary actions, leaders, active state
     phosphor = terminal text accents, prompts, solved state
     amber    = restrained highlight: warnings, clock
   Shape: square everywhere, 1px hairline borders, no rounded cards, no glow.
   Z-index scale: page 0, scanlines 2 (click-through), navbar 1030, modal 1050+ (Bootstrap). */

@font-face {
  font-family: "IBM Plex Mono";
  src: url("../fonts/plex-mono-400.woff2") format("woff2");
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "IBM Plex Mono";
  src: url("../fonts/plex-mono-500.woff2") format("woff2");
  font-weight: 500;
  font-display: swap;
}

@font-face {
  font-family: "IBM Plex Mono";
  src: url("../fonts/plex-mono-600.woff2") format("woff2");
  font-weight: 600 700;
  font-display: swap;
}

@font-face {
  font-family: "VT323";
  src: url("../fonts/vt323.woff2") format("woff2");
  font-weight: 400;
  font-display: swap;
}

:root,
[data-bs-theme="dark"] {
  --rp-bg: #0b0c0a;
  --rp-bg-2: #0f110e;
  --rp-bg-3: #151813;
  --rp-line: #252a22;
  --rp-line-2: #3a4135;
  --rp-text: #d3dccd;
  --rp-bright: #eef3ea;
  --rp-dim: #8d9987;
  --rp-phosphor: #7fe07f;
  --rp-phosphor-dim: #4f9a52;
  --rp-amber: #e6ad4a;
  --rp-red: #ef3044;
  --rp-red-hover: #ff4a5c;
  --rp-red-text: #ff5a6a;
  --rp-red-soft: rgba(239, 48, 68, 0.1);
  --rp-red-line: rgba(239, 48, 68, 0.45);
  --rp-on-red: #0b0c0a;
  --rp-mono: "IBM Plex Mono", "SFMono-Regular", Menlo, Consolas, "Liberation Mono", monospace;
  --rp-pixel: "VT323", "IBM Plex Mono", monospace;
  --rp-art: Menlo, Consolas, "DejaVu Sans Mono", "Liberation Mono", monospace;

  --bs-body-bg: var(--rp-bg);
  --bs-body-color: var(--rp-text);
  --bs-body-font-family: var(--rp-mono);
  --bs-emphasis-color: var(--rp-bright);
  --bs-secondary-color: var(--rp-dim);
  --bs-tertiary-bg: var(--rp-bg-2);
  --bs-secondary-bg: var(--rp-bg-3);
  --bs-border-color: var(--rp-line-2);
  --bs-link-color: var(--rp-red-text);
  --bs-link-color-rgb: 255, 90, 106;
  --bs-link-hover-color: var(--rp-bright);
  --bs-link-hover-color-rgb: 238, 243, 234;
  --bs-primary: var(--rp-red);
  --bs-primary-rgb: 239, 48, 68;
  --bs-heading-color: var(--rp-bright);
  --bs-code-color: var(--rp-phosphor);
  --bs-border-radius: 0;
  --bs-border-radius-sm: 0;
  --bs-border-radius-lg: 0;
  --bs-border-radius-xl: 0;
  --bs-border-radius-pill: 0;
}

/* ── Base ──────────────────────────────────────────────── */
html,
body,
.container,
.jumbotron .container,
button,
input,
select,
textarea {
  font-family: var(--rp-mono);
}

html {
  background: var(--rp-bg);
}

body.rp-body {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  background: var(--rp-bg);
  color: var(--rp-text);
  font-size: 15px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

/* CRT texture: very faint scanlines and grain, fixed and click-through */
body.rp-body::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  background:
    repeating-linear-gradient(180deg, rgba(0, 0, 0, 0.16) 0 1px, transparent 1px 3px),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.05 0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E");
}

main {
  flex: 1 0 auto;
  padding-top: 56px;
  margin-bottom: 0 !important;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  color: var(--rp-bright);
  font-weight: 500;
  letter-spacing: 0;
}

a {
  color: var(--rp-red-text);
  text-decoration: none;
}

a:hover {
  color: var(--rp-bright);
}

p a,
li a,
td a,
.rp-link {
  text-decoration: underline;
  text-decoration-color: var(--rp-red-line);
  text-underline-offset: 3px;
}

code {
  color: var(--rp-phosphor);
  background: transparent;
}

pre {
  color: var(--rp-text);
}

::selection {
  background: var(--rp-red);
  color: var(--rp-on-red);
}

:focus-visible {
  outline: 1px dashed var(--rp-phosphor);
  outline-offset: 3px;
}

hr {
  border-color: var(--rp-line-2);
  opacity: 1;
}

.text-muted,
.text-secondary {
  color: var(--rp-dim) !important;
}

.text-danger {
  color: var(--rp-red-text) !important;
}

.text-success {
  color: var(--rp-phosphor) !important;
}

.rp-skip {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 2000;
  background: var(--rp-red);
  color: var(--rp-on-red);
  padding: 0.5rem 1rem;
}

.rp-skip:focus {
  left: 1rem;
}

.rp-pixel {
  image-rendering: pixelated;
  image-rendering: crisp-edges;
}

.rp-cursor {
  color: var(--rp-phosphor);
}

@media (prefers-reduced-motion: no-preference) {
  .rp-cursor,
  .rp-blink {
    animation: rp-blink 1.1s steps(1) infinite;
  }

  @keyframes rp-blink {
    50% {
      opacity: 0;
    }
  }
}

/* ── Navbar ────────────────────────────────────────────── */
.navbar.rp-nav {
  background: var(--rp-bg) !important;
  border-bottom: 1px solid var(--rp-line-2);
  min-height: 56px;
  padding: 0;
}

.rp-brand {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  font-family: var(--rp-pixel);
  font-size: 1.7rem;
  line-height: 1;
  letter-spacing: 0.04em;
  color: var(--rp-red) !important;
  padding: 0.55rem 0;
  margin-right: 2rem;
}

.rp-nav .nav-link {
  color: var(--rp-text) !important;
  font-size: 0.88rem;
  padding: 0.35rem 0.75rem !important;
  border: 1px solid transparent;
  white-space: nowrap;
}

.rp-nav .nav-link:hover,
.rp-nav .nav-link:focus-visible {
  color: var(--rp-bright) !important;
  background: var(--rp-bg-3);
}

.rp-nav .nav-link.active {
  color: var(--rp-red-text) !important;
}

.rp-nav .nav-link.active::before {
  content: "[ ";
}

.rp-nav .nav-link.active::after {
  content: " ]";
  border: 0;
  margin: 0;
  vertical-align: baseline;
}

.rp-nav .nav-link.dropdown-toggle.active::after,
.rp-nav .dropdown-toggle::after {
  border-top-color: currentColor;
}

.rp-nav .rp-nav-cta {
  border-color: var(--rp-red) !important;
  color: var(--rp-red-text) !important;
  margin-left: 0.35rem;
}

.rp-nav .rp-nav-cta:hover {
  background: var(--rp-red) !important;
  color: var(--rp-on-red) !important;
}

.rp-count {
  display: inline-block;
  min-width: 1.4em;
  padding: 0 0.3em;
  margin-left: 0.25rem;
  background: var(--rp-red);
  color: var(--rp-on-red);
  font-size: 0.75rem;
  text-align: center;
}

.rp-nav .navbar-toggler {
  border: 1px solid var(--rp-line-2);
  border-radius: 0;
  padding: 0.2rem 0.55rem;
  color: var(--rp-text);
  font-family: var(--rp-mono);
}

.rp-nav .navbar-toggler:focus {
  box-shadow: none;
}

.rp-nav .dropdown-menu {
  background: var(--rp-bg);
  border: 1px solid var(--rp-line-2);
  padding: 0.25rem 0;
}

.rp-nav .dropdown-item {
  color: var(--rp-text);
  font-size: 0.88rem;
  cursor: pointer;
}

.rp-nav .dropdown-item:hover,
.rp-nav .dropdown-item.active {
  background: var(--rp-bg-3);
  color: var(--rp-red-text);
}

@media (max-width: 991.98px) {
  .rp-nav .navbar-collapse {
    border-top: 1px solid var(--rp-line);
    padding: 0.5rem 0 1rem;
  }

  .rp-nav .rp-nav-cta {
    margin-left: 0;
    display: inline-block;
  }
}

/* ── Page headers (CTFd "jumbotron") ───────────────────── */
.jumbotron {
  background: transparent;
  color: var(--rp-text);
  text-align: left;
  padding: 2.75rem 0 1.5rem;
  margin-bottom: 1.75rem;
  border-bottom: 1px solid var(--rp-line);
}

.jumbotron h1 {
  font-family: var(--rp-pixel);
  font-size: clamp(2.6rem, 5vw, 3.6rem);
  line-height: 1;
  font-weight: 400;
  color: var(--rp-bright);
  margin: 0;
}

.jumbotron h1::before {
  content: "./";
  color: var(--rp-red);
  margin-right: 0.15em;
}

.rp-sub {
  color: var(--rp-phosphor-dim);
  margin: 0.6rem 0 0;
  font-size: 0.92rem;
}

.rp-sub::before {
  content: "> ";
  color: var(--rp-phosphor);
}

/* ── Buttons ───────────────────────────────────────────── */
.btn {
  border-radius: 0;
  font-family: var(--rp-mono);
  font-weight: 500;
  font-size: 0.92rem;
  padding: 0.55rem 1.1rem;
  transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.btn:active {
  transform: translateY(1px);
}

.btn-primary,
.btn-success,
.btn-info,
.btn-danger {
  --bs-btn-bg: var(--rp-red);
  --bs-btn-border-color: var(--rp-red);
  --bs-btn-color: var(--rp-on-red);
  --bs-btn-hover-bg: var(--rp-red-hover);
  --bs-btn-hover-border-color: var(--rp-red-hover);
  --bs-btn-hover-color: var(--rp-on-red);
  --bs-btn-active-bg: var(--rp-red-hover);
  --bs-btn-active-border-color: var(--rp-red-hover);
  --bs-btn-active-color: var(--rp-on-red);
  --bs-btn-disabled-bg: var(--rp-red);
  --bs-btn-disabled-border-color: var(--rp-red);
  --bs-btn-disabled-color: var(--rp-on-red);
  --bs-btn-focus-shadow-rgb: 239, 48, 68;
}

.btn-secondary,
.btn-outline-secondary,
.btn-outline-primary,
.btn-outline-info,
.btn-outline-success,
.btn-outline-danger,
.btn-dark,
.btn-light {
  --bs-btn-bg: transparent;
  --bs-btn-color: var(--rp-text);
  --bs-btn-border-color: var(--rp-line-2);
  --bs-btn-hover-bg: var(--rp-bg-3);
  --bs-btn-hover-color: var(--rp-bright);
  --bs-btn-hover-border-color: var(--rp-text);
  --bs-btn-active-bg: var(--rp-bg-3);
  --bs-btn-active-color: var(--rp-red-text);
  --bs-btn-active-border-color: var(--rp-red);
}

.btn-outline-danger:hover,
.btn-outline-danger.active {
  color: var(--rp-red-text);
  border-color: var(--rp-red);
}

/* Bracketed command buttons: [ Explore challenges ] */
.rp-cmd::before {
  content: "[ ";
}

.rp-cmd::after {
  content: " ]";
}

.btn-lg.rp-cmd,
.rp-cmd.btn {
  padding: 0.65rem 1.2rem;
}

.btn-close {
  filter: invert(1) grayscale(1) brightness(1.5);
  opacity: 0.6;
}

/* ── Forms ─────────────────────────────────────────────── */
.form-control,
.form-select,
.custom-select {
  background-color: var(--rp-bg);
  border: 1px solid var(--rp-line-2);
  border-radius: 0;
  color: var(--rp-bright);
  font-family: var(--rp-mono);
}

.form-control::placeholder {
  color: var(--rp-dim);
  opacity: 1;
}

.form-control:focus,
.form-select:focus {
  background-color: var(--rp-bg);
  color: var(--rp-bright);
  border-color: var(--rp-phosphor-dim);
  box-shadow: 0 0 0 1px var(--rp-phosphor-dim);
}

.form-control:disabled,
.form-control[readonly] {
  background-color: var(--rp-bg-2);
  color: var(--rp-dim);
}

.form-select {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3e%3cpath fill='%23d3dccd' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e");
}

.form-label,
form label:not(.form-check-label) {
  color: var(--rp-text);
  font-size: 0.88rem;
  font-weight: 500;
  margin-bottom: 0.35rem;
}

form b {
  font-weight: inherit;
}

form .form-label::before,
form b > label::before {
  content: "> ";
  color: var(--rp-phosphor);
}

.form-text,
small.form-text {
  color: var(--rp-dim);
}

.form-check-input {
  border-radius: 0 !important;
  background-color: var(--rp-bg);
  border-color: var(--rp-line-2);
}

.form-check-input:checked {
  background-color: var(--rp-red);
  border-color: var(--rp-red);
}

input[type="file"].form-control::file-selector-button {
  background: var(--rp-bg-3);
  color: var(--rp-text);
}

/* ── Surfaces ──────────────────────────────────────────── */
.card,
.list-group,
.list-group-item {
  background: var(--rp-bg);
  border: 1px solid var(--rp-line-2);
  border-radius: 0;
  color: var(--rp-text);
}

.card-header,
.card-footer {
  background: var(--rp-bg-2);
  border-color: var(--rp-line);
}

.modal-content {
  background: var(--rp-bg);
  border: 1px solid var(--rp-line-2);
  border-top: 2px solid var(--rp-red);
  border-radius: 0;
  color: var(--rp-text);
}

.modal-header,
.modal-footer {
  border-color: var(--rp-line);
}

.modal-backdrop.show {
  opacity: 0.85;
}

.nav-tabs {
  border-bottom: 1px solid var(--rp-line-2);
}

.nav-tabs .nav-link {
  border: 1px solid transparent;
  border-radius: 0;
  color: var(--rp-dim);
  font-size: 0.88rem;
  background: transparent;
}

.nav-tabs .nav-link:hover {
  color: var(--rp-bright);
  border-color: transparent;
}

.nav-tabs .nav-link.active {
  color: var(--rp-red-text);
  background: var(--rp-bg);
  border-color: var(--rp-line-2) var(--rp-line-2) var(--rp-bg);
}

.nav-pills .nav-link {
  border-radius: 0;
  color: var(--rp-text);
  border: 1px solid var(--rp-line-2);
  margin-right: 0.35rem;
}

.nav-pills .nav-link.active {
  background: var(--rp-red);
  color: var(--rp-on-red);
  border-color: var(--rp-red);
}

.badge {
  border-radius: 0;
  font-weight: 500;
  font-family: var(--rp-mono);
}

.badge.bg-primary,
.badge.bg-info,
.badge.bg-secondary {
  background: transparent !important;
  color: var(--rp-text) !important;
  border: 1px solid var(--rp-line-2);
}

.badge.bg-danger {
  background: var(--rp-red) !important;
  color: var(--rp-on-red) !important;
}

.alert {
  border-radius: 0;
  border: 1px solid var(--rp-line-2);
  border-left: 3px solid var(--rp-line-2);
  background: var(--rp-bg-2);
  color: var(--rp-text);
  font-size: 0.92rem;
}

.alert-danger {
  border-left-color: var(--rp-red);
  color: var(--rp-bright);
}

.alert-success {
  border-left-color: var(--rp-phosphor);
  color: var(--rp-bright);
}

.alert-warning {
  border-left-color: var(--rp-amber);
}

.alert-info {
  border-left-color: var(--rp-phosphor-dim);
}

.pagination .page-link {
  background: var(--rp-bg);
  border-color: var(--rp-line-2);
  color: var(--rp-text);
  border-radius: 0 !important;
}

.pagination .page-item.active .page-link {
  background: var(--rp-red);
  border-color: var(--rp-red);
  color: var(--rp-on-red);
}

.progress {
  background: var(--rp-bg-3);
  border-radius: 0;
}

.progress-bar {
  background: var(--rp-red);
}

/* ── Tables ────────────────────────────────────────────── */
.table {
  --bs-table-bg: transparent;
  --bs-table-color: var(--rp-text);
  --bs-table-border-color: var(--rp-line);
  --bs-table-striped-bg: transparent;
  --bs-table-striped-color: var(--rp-text);
  --bs-table-hover-bg: var(--rp-bg-2);
  --bs-table-hover-color: var(--rp-bright);
  font-size: 0.92rem;
}

.table > thead th {
  color: var(--rp-dim);
  font-weight: 400;
  font-size: 0.8rem;
  border-bottom: 1px solid var(--rp-line-2);
  padding-top: 0.6rem;
  padding-bottom: 0.6rem;
}

.table > :not(caption) > * > * {
  padding: 0.7rem 0.75rem;
}

/* ── Shared section furniture ──────────────────────────── */
.rp-label {
  color: var(--rp-dim);
  font-size: 0.78rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.rp-comment {
  color: var(--rp-dim);
}

.rp-comment::before {
  content: "// ";
  color: var(--rp-red);
}

.rp-prompt::before {
  content: "> ";
  color: var(--rp-phosphor);
}

.rp-tag {
  display: inline-block;
  padding: 0.05rem 0.5rem;
  border: 1px solid var(--rp-line-2);
  color: var(--rp-text);
  font-size: 0.8rem;
  line-height: 1.5;
  white-space: nowrap;
}

.rp-empty {
  border: 1px dashed var(--rp-line-2);
  padding: 2rem;
  color: var(--rp-dim);
  text-align: center;
}

.rp-skeleton {
  color: var(--rp-dim);
}

/* ── Footer ────────────────────────────────────────────── */
.rp-footer {
  flex-shrink: 0;
  margin-top: 5rem;
  border-top: 1px solid var(--rp-line-2);
  background: var(--rp-bg);
  font-size: 0.85rem;
  position: relative;
}

.rp-footer::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: -1px;
  height: 2px;
  background: linear-gradient(90deg, var(--rp-red) 0 18%, transparent 18%);
}

.rp-footer-grid {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 2rem;
  padding: 2.25rem 0 1.75rem;
  align-items: start;
}

.rp-footer-brand {
  display: flex;
  gap: 1rem;
  align-items: center;
}

.rp-footer-name {
  font-family: var(--rp-pixel);
  font-size: 2.1rem;
  line-height: 1;
  color: var(--rp-red);
}

.rp-footer-meta {
  color: var(--rp-dim);
  font-size: 0.75rem;
  letter-spacing: 0.1em;
  margin-top: 0.3rem;
}

.rp-footer-links {
  display: grid;
  grid-auto-flow: column;
  grid-template-rows: repeat(3, auto);
  gap: 0.25rem 2.5rem;
}

.rp-footer-links a {
  color: var(--rp-text);
}

.rp-footer-links a:hover {
  color: var(--rp-red-text);
}

.rp-footer-bar {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 0.5rem;
  border-top: 1px solid var(--rp-line);
  padding: 0.9rem 0 1.1rem;
  color: var(--rp-dim);
}

.rp-footer-bar a {
  color: var(--rp-dim);
}

.rp-footer-bar a:hover {
  color: var(--rp-bright);
}

.rp-sep {
  color: var(--rp-line-2);
  margin: 0 0.5rem;
}

@media (max-width: 767.98px) {
  .rp-footer-grid {
    grid-template-columns: 1fr;
  }
}

/* ════════════════════════════════════════════════════════
   HOMEPAGE
   ════════════════════════════════════════════════════════ */
.rp-home {
  overflow-x: clip;
}

.rp-hero {
  position: relative;
  padding: 2.5rem 0 0;
}

.rp-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr);
  gap: 1rem;
  align-items: start;
}

.rp-boot {
  list-style: none;
  padding: 0;
  margin: 0 0 1.75rem;
  color: var(--rp-phosphor);
  font-size: 0.95rem;
  line-height: 1.5;
}

.rp-boot li::before {
  content: "> ";
  color: var(--rp-phosphor-dim);
}

.rp-title {
  font-family: var(--rp-pixel);
  font-weight: 400;
  font-size: clamp(4.5rem, 10.5vw, 8.6rem);
  line-height: 0.82;
  color: var(--rp-red);
  margin: 0 0 0.6rem;
  letter-spacing: 0.01em;
  text-shadow: 3px 3px 0 #4a0d14;
}

.rp-tagline {
  font-family: var(--rp-pixel);
  font-size: clamp(1.9rem, 3.4vw, 2.7rem);
  line-height: 1.05;
  color: var(--rp-bright);
  margin: 0 0 1.5rem;
}

.rp-tagline .rp-angle {
  color: var(--rp-red);
}

.rp-intro {
  max-width: 44ch;
  color: var(--rp-text);
  font-size: 1rem;
  margin-bottom: 1.75rem;
}

.rp-cta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}

.rp-art-wrap {
  position: relative;
  min-height: 100%;
}

.rp-art {
  font-family: var(--rp-art);
  font-size: clamp(5px, 0.74vw, 11px);
  line-height: 1.12;
  color: var(--rp-red);
  margin: 0;
  overflow: visible;
  user-select: none;
  white-space: pre;
  opacity: 0.92;
}

.rp-art--hero {
  margin-left: auto;
  width: max-content;
  max-width: 100%;
}

.rp-art-cats {
  position: absolute;
  left: 0;
  bottom: 8%;
  list-style: none;
  padding: 0;
  margin: 0;
  font-size: 0.92rem;
  line-height: 1.7;
  color: var(--rp-red-text);
}

.rp-art-cats li::before {
  content: "// ";
  color: var(--rp-dim);
}

.rp-motto {
  position: absolute;
  right: 0;
  bottom: 2%;
  text-align: right;
  font-size: 0.85rem;
  line-height: 1.6;
  color: var(--rp-bright);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin: 0;
}

/* Competition status strip */
.rp-status {
  display: grid;
  grid-template-columns: 1.4fr 1.3fr repeat(3, 1fr);
  border: 1px solid var(--rp-line-2);
  margin-top: 2.5rem;
  background: var(--rp-bg);
}

.rp-status > div {
  padding: 1rem 1.25rem;
  border-left: 1px solid var(--rp-line);
  min-width: 0;
}

.rp-status > div:first-child {
  border-left: 0;
}

.rp-status .rp-value {
  font-size: 1.1rem;
  color: var(--rp-bright);
  margin-top: 0.3rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.rp-status .rp-value.is-num {
  font-family: var(--rp-pixel);
  font-size: 2rem;
  line-height: 1;
  color: var(--rp-phosphor);
}

.rp-state {
  font-weight: 600;
  letter-spacing: 0.04em;
}

.rp-state--live {
  color: var(--rp-phosphor);
}

.rp-state--soon {
  color: var(--rp-amber);
}

.rp-state--over {
  color: var(--rp-red-text);
}

.rp-countdown {
  font-family: var(--rp-pixel);
  font-size: 1.6rem;
  line-height: 1;
  color: var(--rp-bright);
  margin-top: 0.35rem;
}

/* Status line under the hero */
.rp-statusline {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  border: 1px solid var(--rp-line-2);
  border-top: 0;
  padding: 0.5rem 1.25rem;
  color: var(--rp-phosphor-dim);
  font-size: 0.85rem;
  background: var(--rp-bg-2);
}

.rp-statusline .rp-ticker {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}

.rp-statusline .rp-ticker::before {
  content: "> ";
  color: var(--rp-phosphor);
}

.rp-statusline .rp-clock {
  color: var(--rp-amber);
  white-space: nowrap;
}

/* Homepage sections */
.rp-block {
  padding: 5.5rem 0 0;
}

.rp-h2 {
  font-family: var(--rp-pixel);
  font-weight: 400;
  font-size: clamp(2.2rem, 4vw, 3rem);
  line-height: 1;
  color: var(--rp-bright);
  margin: 0 0 1rem;
}

.rp-h2 .rp-hash {
  color: var(--rp-red);
}

.rp-lede {
  color: var(--rp-text);
  max-width: 58ch;
}

.rp-split {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(0, 0.75fr);
  gap: clamp(2rem, 5vw, 4.5rem);
  align-items: start;
}

.rp-terms {
  margin: 2rem 0 0;
  display: grid;
  gap: 1.1rem;
}

.rp-terms dt {
  color: var(--rp-red-text);
  font-weight: 500;
}

.rp-terms dt::before {
  content: "$ ";
  color: var(--rp-dim);
}

.rp-terms dd {
  margin: 0.15rem 0 0 1.2rem;
  color: var(--rp-text);
  max-width: 60ch;
}

/* Try-it terminal session */
.rp-session {
  margin-top: 2.5rem;
  border: 1px solid var(--rp-line-2);
  background: var(--rp-bg-2);
}

.rp-session-bar {
  display: flex;
  justify-content: space-between;
  padding: 0.4rem 0.9rem;
  border-bottom: 1px solid var(--rp-line);
  color: var(--rp-dim);
  font-size: 0.8rem;
}

.rp-session-body {
  padding: 1.1rem 1.1rem 1.25rem;
}

.rp-session-body p {
  margin: 0 0 0.6rem;
}

.rp-cipher-line {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;
  margin: 0.8rem 0 1rem;
}

.rp-cipher {
  color: var(--rp-amber);
  word-break: break-all;
}

.rp-mini {
  background: transparent;
  border: 1px solid var(--rp-line-2);
  color: var(--rp-dim);
  font-size: 0.78rem;
  padding: 0.1rem 0.55rem;
}

.rp-mini:hover {
  color: var(--rp-bright);
  border-color: var(--rp-text);
}

.rp-flag-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 0.6rem;
}

.rp-flag-input {
  position: relative;
}

.rp-flag-input::before {
  content: "flag>";
  position: absolute;
  left: 0.8rem;
  top: 50%;
  transform: translateY(-50%);
  color: var(--rp-phosphor);
  font-size: 0.9rem;
  pointer-events: none;
}

.rp-flag-input .form-control {
  padding-left: 4.2rem !important;
}

.rp-feedback {
  margin: 0.6rem 0 0;
  min-height: 1.5rem;
  font-size: 0.9rem;
}

.rp-feedback .is-ok {
  color: var(--rp-phosphor);
}

.rp-feedback .is-bad {
  color: var(--rp-red-text);
}

.rp-session details {
  margin-top: 0.9rem;
  color: var(--rp-dim);
}

.rp-session summary {
  cursor: pointer;
  color: var(--rp-text);
}

/* Live scoreboard preview */
.rp-board-preview {
  border-top: 2px solid var(--rp-red);
}

.rp-board-preview h3 {
  font-family: var(--rp-pixel);
  font-size: 2rem;
  font-weight: 400;
  margin: 0.9rem 0 0.25rem;
}

.rp-ranks {
  list-style: none;
  padding: 0;
  margin: 1rem 0;
}

.rp-ranks li {
  display: grid;
  grid-template-columns: 2.2rem 1fr auto;
  gap: 0.5rem;
  align-items: baseline;
  padding: 0.55rem 0;
  border-bottom: 1px dashed var(--rp-line);
}

.rp-ranks .rp-rank {
  color: var(--rp-dim);
}

.rp-ranks li:nth-child(-n + 3) .rp-rank {
  color: var(--rp-red-text);
}

.rp-ranks li:first-child .rp-who {
  color: var(--rp-bright);
}

.rp-ranks .rp-who {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--rp-text);
  text-decoration: none;
}

.rp-ranks .rp-pts {
  color: var(--rp-phosphor);
  font-variant-numeric: tabular-nums;
}

/* Categories list */
.rp-cats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 3.5rem;
  margin-top: 2rem;
}

.rp-cat {
  display: grid;
  grid-template-columns: 9.5rem 1fr;
  gap: 1rem;
  padding: 1.1rem 0;
  border-top: 1px solid var(--rp-line);
}

.rp-cat-name {
  color: var(--rp-red-text);
  font-weight: 600;
}

.rp-cat-name::before {
  content: "./";
  color: var(--rp-dim);
  font-weight: 400;
}

.rp-cat p {
  margin: 0;
}

.rp-cat .rp-tools {
  color: var(--rp-dim);
  font-size: 0.85rem;
  margin-top: 0.3rem;
}

/* How to play: commands, not steps */
.rp-howto {
  margin-top: 2rem;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border: 1px solid var(--rp-line-2);
}

.rp-howto > div {
  padding: 1.25rem;
  border-left: 1px solid var(--rp-line);
}

.rp-howto > div:first-child {
  border-left: 0;
}

.rp-howto code {
  display: block;
  font-size: 1rem;
  color: var(--rp-phosphor);
  margin-bottom: 0.6rem;
}

.rp-howto code::before {
  content: "$ ";
  color: var(--rp-dim);
}

.rp-howto p {
  margin: 0;
  color: var(--rp-text);
  font-size: 0.92rem;
}

/* Rules + closing */
.rp-rules {
  list-style: none;
  padding: 0;
  margin: 1.5rem 0 0;
}

.rp-rules li {
  padding: 0.35rem 0;
}

.rp-rules li::before {
  content: "> ";
  color: var(--rp-red);
}

.rp-closing {
  margin-top: 5.5rem;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: clamp(1.5rem, 5vw, 4rem);
  align-items: center;
  border-top: 1px solid var(--rp-line-2);
  border-bottom: 1px solid var(--rp-line-2);
  padding: 2.5rem 0;
}

.rp-closing .rp-art {
  font-size: 7px;
  opacity: 0.85;
}

.rp-closing-title {
  font-family: var(--rp-pixel);
  font-size: clamp(2.4rem, 5vw, 3.6rem);
  line-height: 1;
  color: var(--rp-bright);
  margin: 0 0 0.75rem;
}

.rp-closing p {
  max-width: 48ch;
  margin-bottom: 1.5rem;
}

/* ════════════════════════════════════════════════════════
   CHALLENGE BOARD
   ════════════════════════════════════════════════════════ */
.rp-board-tools {
  display: grid;
  gap: 1rem;
  margin-bottom: 1.5rem;
}

.rp-search {
  position: relative;
  max-width: 560px;
}

.rp-search::before {
  content: "grep";
  position: absolute;
  left: 0.8rem;
  top: 50%;
  transform: translateY(-50%);
  color: var(--rp-phosphor);
  font-size: 0.88rem;
  pointer-events: none;
}

.rp-search .form-control {
  padding-left: 3.6rem !important;
}

.rp-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
}

.rp-chip {
  background: transparent;
  border: 1px solid var(--rp-line-2);
  color: var(--rp-text);
  font-size: 0.85rem;
  padding: 0.3rem 0.8rem;
}

.rp-chip:hover {
  border-color: var(--rp-text);
  color: var(--rp-bright);
}

.rp-chip[aria-pressed="true"] {
  background: var(--rp-red);
  border-color: var(--rp-red);
  color: var(--rp-on-red);
}

.rp-toggle {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: var(--rp-dim);
  font-size: 0.85rem;
  cursor: pointer;
}

.rp-toggle input {
  accent-color: var(--rp-red);
}

.rp-progress {
  color: var(--rp-dim);
  font-size: 0.85rem;
}

.rp-progress b {
  color: var(--rp-phosphor);
  font-weight: 500;
}

.rp-chal-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.92rem;
}

.rp-chal-table th {
  color: var(--rp-dim);
  font-weight: 400;
  font-size: 0.8rem;
  text-align: left;
  padding: 0.55rem 0.75rem;
  border-bottom: 1px solid var(--rp-line-2);
  white-space: nowrap;
}

.rp-chal-table td {
  padding: 0.75rem;
  border-bottom: 1px solid var(--rp-line);
  vertical-align: middle;
}

.rp-chal-table tbody tr {
  cursor: pointer;
  transition: background-color 0.12s ease;
}

.rp-chal-table tbody tr:hover,
.rp-chal-table tbody tr:focus-within {
  background: var(--rp-bg-2);
}

.rp-chal-table tbody tr:hover .rp-chal-name,
.rp-chal-table tbody tr:focus-within .rp-chal-name {
  color: var(--rp-red-text);
}

.rp-chal-table .rp-num {
  color: var(--rp-dim);
  width: 3rem;
  font-variant-numeric: tabular-nums;
}

.rp-chal-name {
  background: none;
  border: 0;
  padding: 0;
  color: var(--rp-bright);
  font-family: var(--rp-mono);
  font-size: 0.95rem;
  text-align: left;
}

.rp-chal-table .rp-pts {
  color: var(--rp-bright);
  font-variant-numeric: tabular-nums;
}

.rp-chal-table .rp-chev {
  color: var(--rp-dim);
  width: 1.5rem;
  text-align: right;
}

.rp-solved {
  color: var(--rp-phosphor);
  white-space: nowrap;
}

.rp-solved::before {
  content: "[x] ";
}

.rp-unsolved {
  color: var(--rp-dim);
  white-space: nowrap;
}

.rp-unsolved::before {
  content: "[ ] ";
}

.rp-chal-table tr.is-solved .rp-chal-name {
  color: var(--rp-text);
}

.rp-chal-table tr.is-locked {
  cursor: not-allowed;
  opacity: 0.55;
}

@media (max-width: 767.98px) {
  .rp-chal-table .rp-hide-sm {
    display: none;
  }

  .rp-toggle {
    margin-left: 0;
  }
}

/* ── Challenge window (modal) ──────────────────────────── */
#challenge-window .modal-dialog {
  max-width: 920px;
}

#challenge-window .modal-body {
  padding: 1.25rem 1.5rem 1.75rem;
}

.rp-chal-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.5rem 1rem;
  margin: 1.25rem 0 0.25rem;
}

#challenge-window .challenge-name {
  font-family: var(--rp-pixel);
  font-weight: 400;
  font-size: 2.6rem;
  line-height: 1;
  margin: 0;
  text-align: left !important;
  padding: 0 !important;
}

#challenge-window .challenge-value {
  font-family: var(--rp-pixel);
  font-weight: 400;
  font-size: 2rem;
  color: var(--rp-phosphor);
  margin: 0 0 0 auto;
  text-align: right !important;
}

.rp-chal-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 15rem;
  gap: 1.75rem;
  margin-top: 1rem;
}

#challenge-window .challenge-desc {
  display: block;
  line-height: 1.7;
  color: var(--rp-text);
}

#challenge-window .challenge-desc pre,
#challenge-window pre {
  background: var(--rp-bg-2);
  border: 1px solid var(--rp-line);
  padding: 0.85rem 1rem;
}

.rp-chal-section {
  margin-top: 1.4rem;
}

.rp-chal-section > .rp-label {
  display: block;
  margin-bottom: 0.5rem;
}

.rp-files {
  list-style: none;
  padding: 0;
  margin: 0;
  border: 1px solid var(--rp-line);
}

.rp-files li + li {
  border-top: 1px solid var(--rp-line);
}

.rp-files a {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.55rem 0.8rem;
  color: var(--rp-red-text);
  text-decoration: none;
}

.rp-files a:hover {
  background: var(--rp-bg-2);
  color: var(--rp-bright);
}

.rp-files .rp-dl {
  color: var(--rp-dim);
  white-space: nowrap;
}

#challenge-window .challenge-hints details {
  border: 1px solid var(--rp-line);
  padding: 0.55rem 0.8rem;
  margin-bottom: 0.5rem;
}

#challenge-window .challenge-hints summary {
  color: var(--rp-amber);
  cursor: pointer;
}

#challenge-window .challenge-hints details > div {
  margin-top: 0.6rem;
  color: var(--rp-text);
}

.rp-chal-info {
  border: 1px solid var(--rp-line-2);
  padding: 1rem;
  align-self: start;
  font-size: 0.88rem;
}

.rp-chal-info dl {
  margin: 0;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0.45rem 0.9rem;
}

.rp-chal-info dt {
  color: var(--rp-dim);
  font-weight: 400;
}

.rp-chal-info dd {
  margin: 0;
  color: var(--rp-bright);
  text-align: right;
  overflow-wrap: anywhere;
}

.rp-chal-info .challenge-tags {
  margin-top: 0.8rem;
  padding: 0.8rem 0 0 !important;
  border-top: 1px solid var(--rp-line);
  text-align: left !important;
}

#challenge-window .challenge-tag {
  margin: 0 0.25rem 0.25rem 0;
}

.rp-submit {
  margin-top: 1.6rem;
  border-top: 1px solid var(--rp-line-2);
  padding-top: 1.2rem;
}

#challenge-window .challenge-input {
  font-size: 1rem;
  padding: 0.7rem 0.9rem 0.7rem 4.4rem !important;
}

#challenge-window .challenge-submit {
  font-size: 0.95rem;
}

#challenge-window .notification-row .alert {
  text-align: left !important;
  margin-top: 1rem !important;
}

#challenge-window .notification-row .alert strong::before {
  content: "> ";
}

#challenge-window .challenge-attribution,
#challenge-window .challenge-ratings {
  text-align: left !important;
}

@media (max-width: 767.98px) {
  .rp-chal-grid {
    grid-template-columns: 1fr;
  }

  .rp-chal-info {
    order: -1;
  }
}

/* ════════════════════════════════════════════════════════
   SCOREBOARD
   ════════════════════════════════════════════════════════ */
#score-graph {
  border: 1px solid var(--rp-line);
  background: var(--rp-bg);
  min-height: 380px;
  margin-bottom: 2rem;
}

.rp-score-table {
  width: 100%;
  border-collapse: collapse;
}

.rp-score-table th {
  color: var(--rp-dim);
  font-weight: 400;
  font-size: 0.8rem;
  padding: 0.6rem 1rem;
  border-bottom: 1px solid var(--rp-line-2);
}

.rp-score-table td {
  padding: 0.75rem 1rem;
  border-bottom: 1px solid var(--rp-line);
}

.rp-score-table .rp-rank {
  width: 4.5rem;
  font-family: var(--rp-pixel);
  font-size: 1.6rem;
  line-height: 1;
  color: var(--rp-dim);
}

.rp-score-table .rp-score {
  text-align: right;
  font-variant-numeric: tabular-nums;
  color: var(--rp-phosphor);
  width: 8rem;
}

.rp-score-table .rp-name a {
  color: var(--rp-bright);
  text-decoration: none;
}

.rp-score-table .rp-name a:hover {
  color: var(--rp-red-text);
}

.rp-score-table tr.is-top .rp-rank {
  color: var(--rp-red-text);
}

.rp-score-table tr.is-first td {
  background: var(--rp-red-soft);
}

.rp-score-table tr.is-first td:first-child {
  box-shadow: inset 2px 0 0 var(--rp-red);
}

.rp-score-table tr.is-me td {
  background: rgba(127, 224, 127, 0.06);
}

.rp-you {
  color: var(--rp-phosphor);
  font-size: 0.8rem;
  margin-left: 0.5rem;
}

.rp-score-foot {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 2rem;
  padding: 0.9rem 1rem;
  color: var(--rp-dim);
  font-size: 0.85rem;
}

.rp-score-foot b {
  color: var(--rp-text);
  font-weight: 500;
}

/* ════════════════════════════════════════════════════════
   AUTH (login / register / reset / teams)
   ════════════════════════════════════════════════════════ */
.rp-auth {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 0.8fr);
  gap: clamp(2rem, 6vw, 5rem);
  align-items: start;
}

.rp-auth-form {
  max-width: 480px;
}

.rp-auth-form .btn-primary {
  width: 100%;
  padding: 0.7rem 1rem;
}

.rp-auth-aside {
  border-left: 1px solid var(--rp-line-2);
  padding-left: clamp(1.5rem, 4vw, 3rem);
  color: var(--rp-dim);
}

.rp-auth-aside .rp-art {
  font-size: 8px;
  margin: 1.5rem 0;
}

.rp-auth-aside p {
  margin: 0 0 0.5rem;
  max-width: 34ch;
}

.rp-auth-aside .rp-warn {
  color: var(--rp-amber);
}

.rp-or {
  display: flex;
  align-items: center;
  gap: 1rem;
  color: var(--rp-dim);
  margin: 1.5rem 0 1rem;
  font-size: 0.85rem;
}

.rp-or::before,
.rp-or::after {
  content: "";
  flex: 1;
  border-top: 1px dashed var(--rp-line-2);
}

.rp-alt-links {
  display: grid;
  gap: 0.35rem;
}

.rp-alt-links a::before {
  content: "[ ";
  color: var(--rp-dim);
}

.rp-alt-links a::after {
  content: " ]";
  color: var(--rp-dim);
}

@media (max-width: 767.98px) {
  .rp-auth {
    grid-template-columns: 1fr;
  }

  .rp-auth-aside {
    border-left: 0;
    border-top: 1px solid var(--rp-line-2);
    padding: 1.5rem 0 0;
  }
}

/* ── Generic CMS pages (rules, about, ...) ─────────────── */
.rp-page {
  max-width: 78ch;
}

.rp-page h1 {
  font-family: var(--rp-pixel);
  font-weight: 400;
  font-size: clamp(2.6rem, 5vw, 3.6rem);
  line-height: 1;
  margin: 0 0 1.5rem;
}

.rp-page h1::before {
  content: "./";
  color: var(--rp-red);
}

.rp-page h2,
.rp-page h3 {
  font-size: 1.15rem;
  font-weight: 600;
  margin-top: 2rem;
}

.rp-page h2::before,
.rp-page h3::before {
  content: "## ";
  color: var(--rp-red);
}

.rp-page ul {
  list-style: none;
  padding-left: 0;
}

.rp-page ul li {
  padding-left: 1.4rem;
  position: relative;
  margin: 0.35rem 0;
}

.rp-page ul li::before {
  content: ">";
  position: absolute;
  left: 0;
  color: var(--rp-red);
}

.rp-page blockquote {
  border-left: 2px solid var(--rp-amber);
  padding-left: 1rem;
  color: var(--rp-dim);
}

/* ── Error pages ───────────────────────────────────────── */
.rp-error {
  padding: 4rem 0 1rem;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: clamp(2rem, 6vw, 5rem);
  align-items: center;
}

.rp-error-code {
  font-family: var(--rp-pixel);
  font-size: clamp(6rem, 18vw, 11rem);
  line-height: 0.8;
  color: var(--rp-red);
  margin: 0;
}

.rp-error h1 {
  font-size: 1.3rem;
  margin: 1rem 0 0.75rem;
}

@media (max-width: 767.98px) {
  .rp-error {
    grid-template-columns: 1fr;
  }
}

/* ── Homepage responsive ───────────────────────────────── */
@media (max-width: 991.98px) {
  .rp-hero-grid,
  .rp-split {
    grid-template-columns: 1fr;
  }

  .rp-art-wrap {
    order: -1;
  }

  .rp-art--hero {
    margin: 0 auto;
    font-size: clamp(4px, 1.2vw, 9px);
  }

  .rp-art-cats,
  .rp-motto {
    display: none;
  }

  .rp-status {
    grid-template-columns: 1fr 1fr;
  }

  .rp-status .rp-value {
    white-space: normal;
  }

  .rp-status > div {
    border-left: 0;
    border-top: 1px solid var(--rp-line);
  }

  .rp-status > div:nth-child(-n + 2) {
    border-top: 0;
  }

  .rp-status > div:nth-child(even) {
    border-left: 1px solid var(--rp-line);
  }

  .rp-howto {
    grid-template-columns: 1fr 1fr;
  }

  .rp-howto > div:nth-child(n + 3) {
    border-top: 1px solid var(--rp-line);
  }

  .rp-howto > div:nth-child(3) {
    border-left: 0;
  }
}

@media (max-width: 767.98px) {
  .rp-cats {
    grid-template-columns: 1fr;
  }

  .rp-cat {
    grid-template-columns: 1fr;
    gap: 0.3rem;
  }

  .rp-howto {
    grid-template-columns: 1fr;
  }

  .rp-howto > div {
    border-left: 0 !important;
    border-top: 1px solid var(--rp-line);
  }

  .rp-howto > div:first-child {
    border-top: 0;
  }

  .rp-status > div:last-child {
    grid-column: 1 / -1;
    border-left: 0;
  }

  .rp-closing {
    grid-template-columns: 1fr;
  }

  .rp-closing .rp-art {
    display: none;
  }

  .rp-statusline .rp-clock {
    display: none;
  }

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

[x-cloak] {
  display: none !important;
}