@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=IBM+Plex+Mono:wght@400;500;600&display=swap");

@font-face {
  font-family: "Russo One Local";
  src: url("./fonts/russo-one-400.ttf") format("truetype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

:root {
  color-scheme: dark;
  --font-ui: Inter, system-ui, sans-serif;
  --font-display: "Russo One Local", Inter, sans-serif;
  --font-mono: "IBM Plex Mono", "SFMono-Regular", ui-monospace, Menlo, Consolas, monospace;

  --bg: #020304;
  --panel: rgba(7, 10, 15, 0.94);
  --panel-strong: rgba(4, 6, 10, 0.98);
  --panel-soft: rgba(255, 255, 255, 0.03);
  --panel-soft-2: rgba(255, 255, 255, 0.015);
  --line: rgba(255, 255, 255, 0.08);
  --line-strong: rgba(255, 255, 255, 0.14);
  --line-red: rgba(255, 59, 50, 0.36);
  --text: #f4f7fb;
  --muted: #a4afc0;
  --red: #ff3b32;
  --red-soft: #ff695f;
  --red-glow: rgba(255, 59, 50, 0.22);
  --green: #86ff98;
  --amber: #f4bb71;
  --shadow: 0 22px 50px rgba(0, 0, 0, 0.42);
  --shadow-soft: 0 16px 36px rgba(0, 0, 0, 0.28);
  --clip: polygon(14px 0, 100% 0, 100% calc(100% - 14px), calc(100% - 14px) 100%, 0 100%, 0 14px);
  --clip-wide: polygon(20px 0, 100% 0, 100% calc(100% - 20px), calc(100% - 20px) 100%, 0 100%, 0 20px);
  --header-offset: 124px;
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

html,
body {
  min-height: 100%;
}

body {
  margin: 0;
  font-family: var(--font-ui);
  color: var(--text);
  background: var(--bg);
  overflow-x: hidden;
}

body::before,
body::after {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
}

body::before {
  background-image:
    linear-gradient(rgba(255, 255, 255, 0.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px);
  background-size: 28px 28px;

}

body::after {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.025), rgba(255, 255, 255, 0)),
    repeating-linear-gradient(180deg, rgba(255, 255, 255, 0.016) 0 1px, transparent 1px 3px);
  mix-blend-mode: screen;
  opacity: 0.16;
}

img {
  display: block;
  max-width: 100%;
}

a {
  color: inherit;
  text-decoration: none;
}

button,
input,
select,
textarea {
  font: inherit;
}

code,
pre,
kbd,
samp {
  font-family: var(--font-mono);
}

.page-shell {
  position: relative;
  min-height: 100vh;
}

.site-main {
  padding-top: var(--header-offset);
  min-height: calc(100vh - 140px);
}

.content-shell {
  padding: 28px 0 88px;
}

.container {
  width: min(1180px, calc(100vw - 40px));
  margin: 0 auto;
}

.text-muted,
small,
.small,
.form-text,
.content-shell .text-muted {
  color: var(--muted) !important;
}

/* typography */
.hero-title,
.page-title,
.category-header h2,
.panel-header,
.footer-status,
.primary-link,
.access-btn,
.cta-btn,
.outline-btn,
.pill,
.table thead th,
.challenge-tag,
.small-kicker,
.footer-copy,
.operation-card__type,
.filter-title,
.brand-copy strong,
.brand-copy span,
.utility-link,
.page-subtitle,
.status-line,
.category-index {
  font-family: var(--font-display);
}

.brand-copy strong,
.brand-copy span,
.primary-link,
.utility-link,
.small-kicker,
.page-subtitle,
.category-index,
.table thead th,
.panel-header,
.filter-title,
.operation-card__type,
.footer-status,
.footer-copy {
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

/* topbar */
.topbar {
  position: fixed;
  inset: 0 0 auto 0;
  z-index: 60;
  background: rgba(3, 4, 6, 0.94);
  backdrop-filter: blur(14px);
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.34);
}

.topbar.is-scrolled {
  background: rgba(3, 4, 6, 0.98);
}

.topbar-main {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 24px;
  min-height: 78px;
}

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

.brand-badge {
  width: 42px;
  height: 42px;
  object-fit: contain;
  flex: 0 0 auto;
  filter: drop-shadow(0 0 16px rgba(255, 59, 50, 0.16));
}

.brand-copy {
  display: grid;
  gap: 2px;
  min-width: 0;
  text-transform: uppercase;
}

.brand-copy strong {
  font-size: 13px;
  color: #f8fbff;
  line-height: 1.1;
  white-space: nowrap;
}

.brand-copy span {
  font-size: 9px;
  color: var(--muted);
  line-height: 1.2;
  white-space: nowrap;
}

.topbar-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 22px;
  min-width: 0;
}

.primary-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  min-width: 0;
  flex-wrap: wrap;
}

.primary-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 42px;
  min-width: 0;
  color: #d8dde8;
  font-size: 12px;
  opacity: 0.82;
  transition: opacity .16s ease, color .16s ease, text-shadow .16s ease;
}

.primary-link em {
  color: var(--red-soft);
  font-style: normal;
  flex: 0 0 auto;
}

.primary-link__label {
  display: inline-block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.primary-link--page {
  max-width: 190px;
}

.primary-link:hover,
.primary-link.is-active {
  color: #fff;
  opacity: 1;
  text-shadow: 0 0 16px rgba(255, 59, 50, 0.26);
}

.topbar-cta {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.topbar-cta--guest,
.topbar-cta--authed {
  gap: 10px;
}

.topbar-cta--guest .access-btn {
  min-width: 136px;
  white-space: nowrap;
}

.topbar-cta__lang {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.topbar-toggle {
  display: none;
  margin-left: auto;
  width: 46px;
  height: 46px;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 4px;
  border: 1px solid var(--line-red);
  background: rgba(255, 59, 50, 0.08);
  color: #fff;
  clip-path: var(--clip);
}

.topbar-toggle span {
  display: block;
  width: 18px;
  height: 2px;
  background: currentColor;
}

.utility-bar {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 16px;
  min-height: 38px;
  padding: 0 0 10px;
}

.utility-links {
  display: flex;
  align-items: center;
  gap: 8px 14px;
  flex-wrap: wrap;
}

.utility-mobile-actions {
  display: none;
}

.utility-link,
.lang-toggle,
.theme-switch {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 30px;
  min-width: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: #c5cfdd;
  font-size: 11px;
  line-height: 1;
  opacity: 0.84;
  transition: opacity .16s ease, color .16s ease;
}

.utility-link:hover,
.utility-link.is-active,
.lang-toggle.is-active,
.lang-toggle:hover,
.theme-switch:hover {
  color: #fff;
  opacity: 1;
}

.lang-toggle {
  min-width: 42px;
  justify-content: center;
  padding: 0 10px;
  border: 1px solid transparent;
  clip-path: var(--clip);
}

.lang-toggle.is-active {
  border-color: rgba(255, 255, 255, 0.16);
  background: rgba(255, 59, 50, 0.08);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.04);
}

.utility-link em {
  color: var(--red-soft);
  font-style: normal;
  flex: 0 0 auto;
}

.utility-link__label {
  display: inline-block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.utility-link--page {
  max-width: 220px;
}

.utility-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  height: 20px;
  padding: 0 4px;
  background: rgba(255, 59, 50, 0.16);
  border: 1px solid var(--line-red);
  color: #fff;
  font-size: 10px;
  clip-path: var(--clip);
  flex: 0 0 auto;
}

/* buttons */
.access-btn,
.cta-btn,
.outline-btn,
.btn,
button,
input[type="submit"] {
  border-radius: 0 !important;
}

.access-btn,
.cta-btn,
.outline-btn,
.btn,
input[type="submit"] {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 46px;
  padding: 0 18px;
  color: #fff;
  text-transform: uppercase;
  font-size: 12px;
  clip-path: var(--clip);
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease, background .16s ease;
}

.access-btn,
.cta-btn,
.btn-primary,
input[type="submit"] {
  border: 1px solid rgba(255, 59, 50, 0.42);
  background: linear-gradient(180deg, rgba(255, 59, 50, 0.18), rgba(255, 59, 50, 0.05));
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.05), 0 0 24px rgba(255, 59, 50, 0.14);
}

.outline-btn,
.btn-secondary,
.btn-light,
.btn-dark,
.btn-outline-secondary,
.btn-outline-light,
.btn-outline-primary,
.btn-outline-danger,
.btn-outline-success,
.btn-outline-info,
.btn-outline-warning {
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: rgba(255, 255, 255, 0.03);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.04);
}

.btn-danger,
.btn-warning {
  border: 1px solid rgba(255, 59, 50, 0.42);
  background: linear-gradient(180deg, rgba(255, 59, 50, 0.18), rgba(255, 59, 50, 0.05));
}

.access-btn:hover,
.cta-btn:hover,
.outline-btn:hover,
.btn:hover,
input[type="submit"]:hover {
  color: #fff;
  transform: translateY(-1px);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.06), 0 0 28px rgba(255, 59, 50, 0.18);
}

.btn-close {
  filter: invert(1) brightness(1.3);
  opacity: 0.72;
}

.btn-close:hover {
  opacity: 1;
}

/* hero */
.hero {
  position: relative;
  overflow: hidden;
  padding: 86px 0 22px;
}

.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(2, 4, 6, 0.24), rgba(2, 4, 6, 0.84)),
    linear-gradient(90deg, rgba(2, 4, 6, 0.94), rgba(2, 4, 6, 0.46) 50%, rgba(2, 4, 6, 0.94)),
    linear-gradient(rgba(255, 255, 255, 0.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.03) 1px, transparent 1px),
    linear-gradient(180deg, rgba(9, 12, 18, 0.98), rgba(2, 4, 6, 0.98));
  background-size: auto, auto, 28px 28px, 28px 28px, auto;
  background-position: center;
  opacity: 0.96;
  transform: scale(1.02);
}

.hero::after {
  content: none;
}

.hero-home::before {
  content: none;
}

.hero-inner {
  position: relative;
  z-index: 1;
  min-height: 420px;
  display: grid;
  place-items: center;
  text-align: center;
}

.hero-copy {
  position: relative;
  z-index: 1;
}

.hero-inner--home {
  gap: 28px;
  padding-bottom: 20px;
}

.hero-copy--home {
  max-width: 860px;
}

.hero-title--home {
  display: grid;
  gap: 8px;
  justify-items: center;
  max-width: 100%;
  margin-inline: auto;
  line-height: 1;
  letter-spacing: 0.03em;
}

.hero-title--home-primary {
  white-space: nowrap;
  font-size: clamp(26px, 4.4vw, 54px);
  line-height: 1.02;
}

.hero-title--home-secondary {
  font-size: clamp(22px, 3vw, 34px);
  letter-spacing: 0.14em;
}

.hero-mark {
  position: absolute;
  width: min(520px, 64vw);
  top: 8px;
  left: 50%;
  transform: translateX(-50%);
  opacity: 0.18;
  filter: none;
}

.small-kicker {
  margin-bottom: 10px;
  font-size: 11px;
  color: var(--muted);
}

.hero-title,
.page-title {
  margin: 0;
  color: #f8fbff;
  text-transform: uppercase;
  text-shadow: 0 0 18px rgba(255,255,255,0.05);
}

.hero-title {
  font-size: clamp(42px, 6.5vw, 78px);
  line-height: 0.96;
  letter-spacing: 0.06em;
}

.hero-subtitle,
.page-subtitle {
  max-width: 760px;
  color: #d7dce5;
  font-size: 14px;
}

.hero-subtitle {
  margin: 18px auto 26px;
  max-width: 58ch;
  line-height: 1.6;
}

.hero-actions {
  display: flex;
  gap: 14px;
  justify-content: center;
  flex-wrap: wrap;
}

.home-ops-card {
  width: min(920px, 100%);
  padding: 20px 22px;
}

.home-ops-card__body {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-top: 12px;
}

.home-ops-card__line {
  display: grid;
  gap: 8px;
  padding: 14px 16px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: rgba(255, 255, 255, 0.025);
  clip-path: var(--clip);
}

.home-ops-card__line span {
  color: var(--muted);
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.home-ops-card__line strong {
  color: #fff;
  font-size: 15px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.home-welcome {
  padding-top: 12px;
}

.home-welcome-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(320px, 0.9fr);
  gap: 18px;
  align-items: start;
}

.home-brief-card,
.home-flow-card,
.home-pillar {
  padding: 24px;
}

.home-card-title {
  margin: 8px 0 14px;
  color: #fff;
  font-family: var(--font-display);
  font-size: clamp(24px, 3vw, 34px);
  line-height: 1.08;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.home-card-copy {
  margin: 0 0 18px;
  max-width: 62ch;
  color: #d7dde7;
}

.home-card-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.home-card-tag {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 0 12px;
  border: 1px solid rgba(255, 255, 255, 0.10);
  background: rgba(255, 255, 255, 0.03);
  color: #eef2f8;
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  clip-path: var(--clip);
}

.home-flow-list {
  display: grid;
  gap: 12px;
  margin-top: 12px;
}

.home-flow-step {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 12px;
  align-items: start;
  padding: 14px 16px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: rgba(255, 255, 255, 0.025);
  clip-path: var(--clip);
}

.home-flow-step > span {
  color: var(--red-soft);
  font-family: var(--font-display);
  font-size: 12px;
  letter-spacing: 0.14em;
}

.home-flow-step strong {
  display: block;
  color: #fff;
  font-size: 14px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.home-flow-step p {
  margin: 6px 0 0;
  color: #c7d0dd;
}

.home-pillars {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin-top: 18px;
}

.home-pillar h3 {
  margin: 8px 0 10px;
  color: #fff;
  font-family: var(--font-display);
  font-size: 18px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.home-pillar p {
  margin: 0;
  color: #d2d9e3;
}

.page-hero {
  padding: 34px 0 0;
}

.page-hero-compact {
  padding-top: 18px;
}

.page-header {
  margin-bottom: 18px;
}

.page-title {
  font-size: clamp(28px, 5vw, 44px);
  letter-spacing: 0.08em;
}

.page-subtitle {
  margin: 12px 0 0;
  line-height: 1.6;
}

/* content blocks */
.main-section {
  padding: 30px 0 88px;
}

.main-section-tight {
  padding-top: 10px;
}

.main-section-compact {
  padding-top: 8px;
}

.redline-frame,
.card,
.alert,
.toast,
.dropdown-menu,
.offcanvas,
.list-group-item,
.table-wrap,
.table-responsive,
.modal-content,
.accordion-item,
.generic-page-frame,
.score-graph-shell {
  position: relative;
  background: linear-gradient(180deg, rgba(255,255,255,0.035), rgba(255,255,255,0.015));
  border: 1px solid var(--line);
  clip-path: var(--clip-wide);
  box-shadow: var(--shadow);
  border-radius: 0 !important;
}

.redline-frame::before,
.card::before,
.table-wrap::before,
.modal-content::before,
.accordion-item::before,
.generic-page-frame::before,
.score-graph-shell::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(255, 59, 50, 0.07), transparent 30%);
}

.redline-frame--soft {
  box-shadow: var(--shadow-soft);
}

.panel-header,
.filter-title {
  color: var(--muted);
  font-size: 12px;
}

.generic-page-frame,
.error-frame {
  padding: 24px;
}

.page-title--preserve-case {
  text-transform: none;
  letter-spacing: 0.04em;
}

.page-hero--faq .page-header,
.page-hero--archive-index .page-header,
.page-hero--archive-entry .page-header {
  display: grid;
  gap: 12px;
  align-content: start;
}

.page-hero--faq .small-kicker,
.page-hero--archive-index .small-kicker,
.page-hero--archive-entry .small-kicker {
  margin-bottom: 0;
}

.page-hero--faq .page-title,
.page-hero--archive-index .page-title,
.page-hero--archive-entry .page-title {
  line-height: 1.08;
}

.page-hero--faq .page-subtitle,
.page-hero--archive-index .page-subtitle,
.page-hero--archive-entry .page-subtitle {
  margin-top: 0;
  max-width: 860px;
}

.page-hero__chips {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  margin-top: 0;
}

.page-hero__chip {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 0 12px;
  border: 1px solid rgba(255,255,255,0.1);
  background: rgba(255,255,255,0.035);
  clip-path: var(--clip);
  color: #eef2f8;
  font-family: var(--font-display);
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.static-page-shell {
  display: grid;
  grid-template-columns: minmax(0, 290px) minmax(0, 1fr);
  gap: 18px;
  align-items: start;
}

.static-page-shell--faq {
  grid-template-columns: 1fr;
}

.static-page-shell--faq .page-sidecard {
  position: static;
  top: auto;
}

.static-page-side {
  min-width: 0;
}

.page-sidecard {
  display: grid;
  gap: 14px;
  padding: 20px;
  position: sticky;
  top: 106px;
}

.page-sidecard__title {
  margin: 0;
  color: #f7fbff;
  font-size: 20px;
  line-height: 1.15;
}

.page-sidecard__text {
  margin: 0;
  color: #cfd6e1;
  line-height: 1.65;
}

.page-sidecard__list {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.page-sidecard__item {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 0 12px;
  border: 1px solid rgba(255, 59, 50, 0.18);
  background: rgba(255, 59, 50, 0.08);
  clip-path: var(--clip);
  color: #eef3fb;
  font-size: 11px;
  letter-spacing: 0.06em;
}

.generic-page-frame--faq,
.generic-page-frame--archive-index,
.generic-page-frame--archive-entry {
  padding: 26px;
}

.generic-page-frame--faq::before,
.generic-page-frame--archive-index::before,
.generic-page-frame--archive-entry::before {
  background: linear-gradient(180deg, rgba(255, 59, 50, 0.10), transparent 28%);
}

.rich-copy--page > :first-child {
  margin-top: 0;
}

.rich-copy--page > :last-child {
  margin-bottom: 0;
}

.rich-copy--page h1,
.rich-copy--page h2,
.rich-copy--page h3,
.rich-copy--page h4,
.rich-copy--page h5,
.rich-copy--page h6 {
  scroll-margin-top: 120px;
}

.rich-copy--page h2,
.rich-copy--page h3 {
  margin-top: 1.9em;
}

.rich-copy--page a {
  color: #f6fbff;
  text-decoration: none;
  border-bottom: 1px solid rgba(255,255,255,0.16);
  transition: color .16s ease, border-color .16s ease, background .16s ease, box-shadow .16s ease;
}

.rich-copy--page a:hover,
.rich-copy--page a:focus-visible {
  color: #fff;
  border-bottom-color: rgba(255, 59, 50, 0.42);
}

.rich-copy--page ul,
.rich-copy--page ol {
  padding-left: 1.4rem;
}

.rich-copy--page hr {
  margin: 1.8rem 0;
  border: 0;
  border-top: 1px solid rgba(255,255,255,0.08);
}

.rich-copy--page table {
  width: 100%;
  margin: 18px 0;
  border-collapse: collapse;
}

.rich-copy--page th,
.rich-copy--page td {
  padding: 10px 12px;
  border: 1px solid rgba(255,255,255,0.08);
  color: #dbe2ec;
  vertical-align: top;
}

.rich-copy--page th {
  color: #f8fbff;
  background: rgba(255,255,255,0.03);
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.rich-copy--faq h2,
.rich-copy--archive-index h2,
.rich-copy--archive-entry h2 {
  display: flex;
  align-items: center;
  gap: 10px;
}

.rich-copy--faq h2::before,
.rich-copy--archive-index h2::before,
.rich-copy--archive-entry h2::before {
  content: "";
  width: 18px;
  height: 1px;
  background: rgba(255, 59, 50, 0.48);
}

.rich-copy--archive-index ul > li,
.rich-copy--archive-entry ul > li {
  margin-bottom: 0.42rem;
}

.rich-copy--archive-index ul > li > a,
.rich-copy--archive-entry ul > li > a {
  font-weight: 600;
}

.rich-copy--archive-index a[href*="/files/"],
.rich-copy--archive-entry a[href*="/files/"] {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 40px;
  padding: 0 14px;
  margin: 4px 8px 4px 0;
  border: 1px solid rgba(255, 59, 50, 0.34);
  background: linear-gradient(180deg, rgba(255, 59, 50, 0.18), rgba(255, 59, 50, 0.05));
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.04), 0 0 18px rgba(255, 59, 50, 0.10);
  clip-path: var(--clip);
  color: #f4f7fc;
  border-bottom: 0;
}

.rich-copy--archive-index a[href*="/files/"]::after,
.rich-copy--archive-entry a[href*="/files/"]::after {
  content: "↓";
  color: rgba(255,255,255,0.72);
  font-family: var(--font-display);
  font-size: 14px;
  line-height: 1;
}

.rich-copy--archive-index a[href*="/files/"]:hover,
.rich-copy--archive-index a[href*="/files/"]:focus-visible,
.rich-copy--archive-entry a[href*="/files/"]:hover,
.rich-copy--archive-entry a[href*="/files/"]:focus-visible {
  color: #fff;
  border-bottom: 0;
  border-color: rgba(255, 92, 84, 0.52);
  background: linear-gradient(180deg, rgba(255, 59, 50, 0.24), rgba(255, 59, 50, 0.09));
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.05), 0 0 24px rgba(255, 59, 50, 0.16);
}

@media (max-width: 767.98px) {
  .page-hero__chips {
    justify-content: flex-start;
  }

  .static-page-shell {
    grid-template-columns: 1fr;
  }

  .page-sidecard {
    position: static;
    top: auto;
    padding: 16px;
  }

  .generic-page-frame--faq,
  .generic-page-frame--archive-index,
  .generic-page-frame--archive-entry {
    padding: 20px;
  }
}

.rich-copy,
.rich-copy p,
.rich-copy li,
.rich-copy blockquote,
.content-shell p,
.content-shell li,
.content-shell dd,
.content-shell dt,
.content-shell label,
.content-shell small {
  color: #d7dde7;
  line-height: 1.7;
}

.rich-copy h1,
.rich-copy h2,
.rich-copy h3,
.rich-copy h4,
.rich-copy h5,
.rich-copy h6,
.content-shell h1,
.content-shell h2,
.content-shell h3,
.content-shell h4,
.content-shell h5,
.content-shell h6 {
  color: #fff;
}

pre,
code:not(pre code),
.codehilite,
.content-shell blockquote {
  background: rgba(4, 7, 10, 0.92);
  border: 1px solid var(--line);
  border-radius: 0;
}

pre,
.codehilite,
.content-shell blockquote {
  padding: 14px 16px;
  clip-path: var(--clip);
}

code:not(pre code) {
  padding: 2px 7px;
  clip-path: var(--clip);
}

/* forms */
.form-control,
.form-select,
.form-check-input,
.form-control-file,
input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
input[type="search"],
textarea,
select {
  background: rgba(5, 8, 12, 0.96) !important;
  border: 1px solid rgba(255, 255, 255, 0.10) !important;
  color: #f8fbff !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  clip-path: var(--clip);
}

input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
input[type="search"],
select,
.form-control,
.form-select {
  min-height: 46px;
}

textarea {
  min-height: 120px;
  padding-top: 12px;
  padding-bottom: 12px;
}

.form-control:focus,
.form-select:focus,
.form-check-input:focus,
textarea:focus,
input:focus,
select:focus {
  border-color: rgba(255, 59, 50, 0.50) !important;
  box-shadow: 0 0 0 0.2rem rgba(255, 59, 50, 0.10) !important;
}

.form-check-input {
  clip-path: none;
}

::placeholder {
  color: #8f9aae !important;
  opacity: 1;
}

/* tables */
.table-wrap,
.table-responsive {
  padding: 10px;
}

.table {
  --bs-table-bg: transparent;
  --bs-table-border-color: rgba(255,255,255,0.08);
  --bs-table-striped-bg: rgba(255,255,255,0.03);
  --bs-table-hover-bg: rgba(255, 59, 50, 0.05);
  color: #eef2f8;
  margin-bottom: 0;
}

.table thead th,
.table thead td {
  border-bottom-width: 1px;
  color: #f8fbff !important;
  font-size: 11px;
}

.table > :not(caption) > * > * {
  background: transparent;
}

.scoreboard-filter {
  display: grid;
  gap: 12px;
  padding: 16px 18px;
  margin-bottom: 18px;
}

.pills {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.pill {
  min-height: 38px;
  padding: 0 14px;
  border: 1px solid rgba(255,255,255,0.12);
  background: rgba(255,255,255,0.03);
  color: #e5e9f1;
  font-size: 12px;
  clip-path: var(--clip);
}

.pill.active {
  border-color: rgba(255, 59, 50, 0.42);
  background: linear-gradient(180deg, rgba(255, 59, 50, 0.18), rgba(255, 59, 50, 0.08));
}

.scoreboard-table tbody th,
.scoreboard-table tbody td {
  border-color: rgba(255,255,255,0.08);
}

.scoreboard-table tbody tr:hover td,
.scoreboard-table tbody tr:hover th {
  color: #fff;
}

.scoreboard-table a {
  color: #fff;
}

.bracket-badge,
.badge,
[class*="badge-"] {
  border-radius: 0 !important;
  clip-path: var(--clip);
  background: rgba(255, 59, 50, 0.14) !important;
  border: 1px solid rgba(255, 59, 50, 0.34);
  color: #fff !important;
}

/* board */
.board-shell {
  padding: 22px;
}

.board-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 360px;
}

.board-content {
  display: grid;
  gap: 22px;
}

.category-section {
  display: grid;
  gap: 12px;
}

.category-header {
  display: flex;
  align-items: center;
  gap: 10px;
  padding-bottom: 8px;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}

.category-index {
  color: var(--red-soft);
  font-size: 12px;
}

.category-header h2 {
  margin: 0;
  font-size: 18px;
  color: #fff;
}

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

.challenge-button {
  width: 100%;
  padding: 0;
  text-align: left;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.operation-card {
  position: relative;
  width: 100%;
  min-height: 154px;
  padding: 18px;
  border: 1px solid rgba(255,255,255,0.08);
  background: linear-gradient(180deg, rgba(255,255,255,0.03), rgba(255,255,255,0.015));
  clip-path: var(--clip-wide);
  box-shadow: var(--shadow-soft);
  overflow: hidden;
}

.operation-card::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(255, 59, 50, 0.08), transparent 34%);
}

.operation-card:hover {
  border-color: rgba(255, 59, 50, 0.34);
  box-shadow: 0 18px 36px rgba(0,0,0,0.36), 0 0 24px rgba(255, 59, 50, 0.08);
  transform: translateY(-2px);
}

.challenge-solved .operation-card,
.operation-card.challenge-solved {
  border-color: rgba(134, 255, 152, 0.26);
  box-shadow: 0 18px 36px rgba(0,0,0,0.36), 0 0 22px rgba(134, 255, 152, 0.10);
}

.challenge-solved .operation-card::before,
.operation-card.challenge-solved::before {
  background: linear-gradient(180deg, rgba(134, 255, 152, 0.09), transparent 34%);
}

.operation-card__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.operation-card__type {
  color: var(--muted);
  font-size: 11px;
}

.operation-card__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(255,255,255,0.03);
  clip-path: var(--clip);
  color: rgba(255,255,255,0.85);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.04);
}

.operation-card__icon.is-solved {
  border-color: rgba(134, 255, 152, 0.26);
  background: rgba(134, 255, 152, 0.07);
  color: var(--green);
}

.operation-card__title {
  margin-top: 14px;
  font-size: 24px;
  line-height: 1.1;
  color: #fff;
  overflow-wrap: anywhere;
}

.operation-card__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  margin-top: 18px;
  font-size: 12px;
  color: #cfd6e2;
}

.operation-card__points,
.operation-card__solves,
.operation-card__status {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 10px;
  border: 1px solid rgba(255,255,255,0.08);
  background: rgba(255,255,255,0.02);
  clip-path: var(--clip);
}

.operation-card__points,
.operation-card__solves {
  gap: 6px;
}

.operation-card__status {
  color: var(--red-soft);
}

.challenge-solved .operation-card__status,
.operation-card.challenge-solved .operation-card__status {
  color: var(--green);
}

.empty-state {
  padding: 26px;
}

.empty-state p {
  margin: 10px 0 0;
  color: var(--muted);
}

/* modals and popups */
.modal-backdrop.show {
  opacity: 0.78;
}

.modal-backdrop {
  backdrop-filter: none !important;
}

.modal,
#challenge-window.modal {
  z-index: 2005 !important;
}

.modal-backdrop,
.modal-backdrop.show {
  z-index: 2000 !important;
  background: rgba(0, 0, 0, 0.78) !important;
}

#challenge-window,
#challenge-window .modal-dialog,
#challenge-window .modal-content {
  pointer-events: auto;
}

.modal-content,
#challenge-window .modal-content {
  background: linear-gradient(180deg, rgba(8, 11, 16, 0.98), rgba(4, 6, 10, 0.98));
}

#challenge-window .modal-dialog {
  max-width: min(860px, calc(100vw - 36px));
}

.modal-header,
.modal-footer {
  border-color: rgba(255,255,255,0.08);
}

.modal-header,
.modal-body,
.modal-footer {
  position: relative;
  z-index: 1;
}

#challenge-window .modal-header {
  align-items: flex-start;
}

#challenge-window .modal-title,
#challenge-window h1,
#challenge-window h2,
#challenge-window h3,
#challenge-window h4,
#challenge-window h5 {
  color: #fff;
}

#challenge-window .nav,
#challenge-window .nav-tabs,
#challenge-window .nav-pills {
  gap: 8px;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

#challenge-window .nav-item {
  margin: 0;
}

#challenge-window .nav-link,
.nav-tabs .nav-link,
.nav-pills .nav-link {
  min-height: 38px;
  padding: 0 14px;
  border: 1px solid rgba(255,255,255,0.10) !important;
  background: rgba(255,255,255,0.03) !important;
  color: #eef3fb !important;
  border-radius: 0 !important;
  clip-path: var(--clip);
  text-transform: uppercase;
  font-size: 11px;
  letter-spacing: 0.12em;
}

#challenge-window .nav-link.active,
#challenge-window .nav-link:hover,
.nav-tabs .nav-link.active,
.nav-pills .nav-link.active,
.nav-tabs .show > .nav-link,
.nav-pills .show > .nav-link {
  border-color: rgba(255, 59, 50, 0.42) !important;
  background: linear-gradient(180deg, rgba(255, 59, 50, 0.20), rgba(255, 59, 50, 0.08)) !important;
}

#challenge-window .tab-content {
  margin-top: 14px;
}

#challenge-window .challenge-desc,
#challenge-window .challenge-text,
#challenge-window .modal-body,
#challenge-window .modal-body p,
#challenge-window .modal-body li,
#challenge-window .modal-body dd,
#challenge-window .modal-body dt,
#challenge-window .modal-body label,
#challenge-window .modal-body small {
  color: #d6dce7;
}

#challenge-window .modal-body h1,
#challenge-window .modal-body h2,
#challenge-window .modal-body h3,
#challenge-window .modal-body h4,
#challenge-window .modal-body h5,
#challenge-window .modal-body h6 {
  color: #fff;
}

#challenge-window .challenge-attribution,
#challenge-window .challenge-tags,
#challenge-window .challenge-files,
#challenge-window .challenge-hints,
#challenge-window .challenge-connection-info,
#challenge-window .challenge-submit,
#challenge-window .challenge-input,
#challenge-window .challenge-actions,
#challenge-window .challenge-solves,
#challenge-window .challenge-submissions {
  margin-top: 16px;
}

#challenge-window .list-group-item,
#challenge-window .challenge-file,
#challenge-window .challenge-tag {
  background: rgba(255,255,255,0.03);
  border-color: rgba(255,255,255,0.08);
  color: #eef2f8;
}

#challenge-window .challenge-tag,
#challenge-window .badge {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 10px;
}

#challenge-window .challenge-files {
  padding: 14px 12px;
  border: 1px solid rgba(255, 59, 50, 0.18);
  background: linear-gradient(180deg, rgba(43, 12, 12, 0.22), rgba(8, 10, 14, 0.92));
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.03);
  clip-path: var(--clip-wide);
}

#challenge-window .challenge-files .file-button-wrapper {
  margin-bottom: 10px;
}

#challenge-window .challenge-files .btn.btn-info.btn-file,
#challenge-window .challenge-files .btn.btn-info.btn-file:visited {
  min-height: 42px;
  border: 1px solid rgba(255, 59, 50, 0.34) !important;
  background: linear-gradient(180deg, rgba(255, 59, 50, 0.18), rgba(255, 59, 50, 0.05)) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.04), 0 0 18px rgba(255, 59, 50, 0.10);
  color: #f4f7fc !important;
}

#challenge-window .challenge-files .btn.btn-info.btn-file:hover,
#challenge-window .challenge-files .btn.btn-info.btn-file:focus,
#challenge-window .challenge-files .btn.btn-info.btn-file:focus-visible,
#challenge-window .challenge-files .btn.btn-info.btn-file:active {
  border-color: rgba(255, 92, 84, 0.52) !important;
  background: linear-gradient(180deg, rgba(255, 59, 50, 0.24), rgba(255, 59, 50, 0.09)) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.05), 0 0 24px rgba(255, 59, 50, 0.16);
  color: #fff !important;
}

#challenge-window .challenge-files .btn.btn-info.btn-file i,
#challenge-window .challenge-files .btn.btn-info.btn-file small {
  color: inherit !important;
}

#challenge-window .alert {
  color: #fff;
}

#challenge-window .submit-row {
  align-items: stretch;
  row-gap: 12px;
}

#challenge-window .key-submit {
  display: flex;
}

#challenge-window .key-submit .challenge-submit {
  min-height: 52px;
  height: auto !important;
}

#challenge-window .notification-row {
  margin-top: 18px;
}

#challenge-window .notification-row .alert {
  margin-top: 0 !important;
  margin-bottom: 0;
}

#challenge-window .accordion-button {
  background: rgba(255,255,255,0.03) !important;
  color: #fff !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

#challenge-window .accordion-button:not(.collapsed) {
  background: rgba(255, 59, 50, 0.12) !important;
}

#challenge-window .accordion-button::after {
  filter: invert(1);
}

#challenge-window .accordion-body {
  color: #d5dbe7;
}

.dropdown-menu {
  margin-top: 8px;
  padding: 8px;
  background: rgba(8, 11, 16, 0.98);
  border: 1px solid rgba(255,255,255,0.08);
}

.dropdown-item {
  display: block;
  padding: 10px 12px;
  color: #e7ecf5;
  cursor: pointer;
  clip-path: var(--clip);
}

.dropdown-item:hover,
.dropdown-item.is-current,
.dropdown-item:focus {
  color: #fff;
  background: rgba(255, 59, 50, 0.14);
}

.toast,
.offcanvas,
.popover,
.tooltip-inner {
  color: #eef2f8;
}

.popover {
  border: 1px solid rgba(255,255,255,0.08);
  background: rgba(8, 11, 16, 0.98);
  border-radius: 0 !important;
  clip-path: var(--clip);
}

.popover-header {
  border-color: rgba(255,255,255,0.08);
  background: rgba(255,255,255,0.04);
  color: #fff;
}

.tooltip-inner {
  background: rgba(8, 11, 16, 0.98);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 0;
  clip-path: var(--clip);
}

.tooltip .tooltip-arrow::before {
  border-top-color: rgba(8, 11, 16, 0.98) !important;
  border-bottom-color: rgba(8, 11, 16, 0.98) !important;
}

.alert-danger,
.alert-warning {
  border-color: rgba(255, 59, 50, 0.34);
  background: rgba(255, 59, 50, 0.10);
}

.alert-success,
.alert-info {
  border-color: rgba(134, 255, 152, 0.24);
  background: rgba(134, 255, 152, 0.08);
}

.nav-tabs,
.nav-pills {
  gap: 10px;
  padding: 0;
  border: 0;
  background: transparent;
}

.pagination {
  gap: 8px;
}

.page-link {
  background: rgba(255,255,255,0.03);
  border-color: rgba(255,255,255,0.08);
  color: #fff;
  border-radius: 0 !important;
  clip-path: var(--clip);
}

.page-item.active .page-link,
.page-link:hover {
  background: rgba(255, 59, 50, 0.14);
  border-color: rgba(255, 59, 50, 0.35);
  color: #fff;
}

/* cards used in core pages */
.card,
.content-shell .container > .row > .col-md-6 > .card,
.content-shell .container > .row > .col-lg-6 > .card,
.content-shell .container > .row > .col > .card {
  overflow: hidden;
}

.card-header,
.card-footer {
  position: relative;
  z-index: 1;
  border-color: rgba(255,255,255,0.08);
  background: rgba(255,255,255,0.03);
}

/* footer */
.footer {
  position: relative;
  z-index: 5;
  padding: 20px 0 36px;
  border-top: 1px solid rgba(255,255,255,0.06);
}

.footer-inner {
  position: relative;
  z-index: 6;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}

.footer-brand {
  color: #f4f6fa;
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

.footer-socials {
  position: relative;
  z-index: 7;
  display: flex;
  align-items: center;
  gap: 12px;
  color: var(--muted);
  font-size: 11px;
}

.footer-link {
  position: relative;
  z-index: 8;
  pointer-events: auto;
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 0 14px;
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(255,255,255,0.03);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.04);
  color: #fff;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  cursor: pointer;
  clip-path: var(--clip);
  transition: transform .16s ease, border-color .16s ease, background .16s ease, box-shadow .16s ease;
}

.footer-link:hover {
  border-color: rgba(255, 59, 50, 0.34);
  background: rgba(255, 59, 50, 0.08);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.05), 0 0 20px rgba(255, 59, 50, 0.10);
}

/* misc core pages */
.jumbotron,
.hero-card,
.bg-light,
.bg-white {
  background: transparent !important;
}

.content-shell .container > .row + .row,
.content-shell .container > .row + form,
.content-shell .container > form {
  margin-top: 16px;
}

.content-shell hr,
.modal hr {
  border-color: rgba(255,255,255,0.08);
  opacity: 1;
}

.auth-frame {
  display: grid;
  gap: 18px;
}

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

.auth-switch__link {
  width: 100%;
  min-height: 46px;
}

.auth-oauth-btn {
  width: 100%;
  justify-content: center;
  text-align: center;
}

.spinner {
  color: #fff;
}



#challenge-window [class*="rounded"],
#challenge-window .btn-group > .btn,
#challenge-window .btn-group-vertical > .btn,
#challenge-window .input-group-text {
  border-radius: 0 !important;
  clip-path: var(--clip);
}

#challenge-window .input-group,
#challenge-window .input-group > * {
  min-height: 46px;
}

#score-graph {
  min-height: 260px;
  margin-bottom: 18px;
}

/* account pages */
.account-hero,
body[data-page="user-public"] .jumbotron,
body[data-page="team-public"] .jumbotron {
  margin-bottom: 20px;
}

.account-hero__frame,
body[data-page="user-public"] .jumbotron > .container,
body[data-page="team-public"] .jumbotron > .container {
  position: relative;
  overflow: hidden;
  padding: clamp(24px, 3vw, 34px);
  text-align: center;
  background: linear-gradient(180deg, rgba(17, 21, 29, 0.97), rgba(7, 10, 15, 0.99));
  border: 1px solid rgba(255,255,255,0.08);
  clip-path: var(--clip-wide);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.025), var(--shadow);
}

.account-hero__frame::before,
body[data-page="user-public"] .jumbotron > .container::before,
body[data-page="team-public"] .jumbotron > .container::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(255, 59, 50, 0.10), transparent 32%),
    repeating-linear-gradient(180deg, rgba(255,255,255,0.018) 0 1px, transparent 1px 4px);
  opacity: 0.85;
}

.account-hero__frame::after,
body[data-page="user-public"] .jumbotron > .container::after,
body[data-page="team-public"] .jumbotron > .container::after {
  content: "";
  position: absolute;
  inset: 14px;
  pointer-events: none;
  border: 1px solid rgba(255,255,255,0.04);
  clip-path: polygon(10px 0, 100% 0, 100% calc(100% - 10px), calc(100% - 10px) 100%, 0 100%, 0 10px);
  box-shadow: inset 0 0 0 1px rgba(255, 59, 50, 0.08);
  opacity: 0.65;
}

.account-hero__frame > *,
body[data-page="user-public"] .jumbotron > .container > *,
body[data-page="team-public"] .jumbotron > .container > * {
  position: relative;
  z-index: 1;
}

.account-hero__lead {
  display: grid;
  gap: 8px;
  justify-items: center;
}

.account-hero__lead h1,
body[data-page="user-public"] .jumbotron > .container > h1,
body[data-page="team-public"] .jumbotron > .container > h1 {
  max-width: min(100%, 920px);
  margin: 0;
  font-family: var(--font-display);
  font-size: clamp(34px, 6vw, 60px);
  line-height: 0.95;
  letter-spacing: 0.03em;
  text-transform: none;
  color: #fff;
  text-shadow: 0 0 24px rgba(255, 59, 50, 0.14);
  word-break: break-word;
}

.account-hero__team {
  margin: 0;
}

.account-hero__team .badge.bg-secondary,
body[data-page="user-public"] .jumbotron > .container h2 .badge.bg-secondary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 0 16px;
  border-radius: 0 !important;
  border: 1px solid rgba(255, 59, 50, 0.32);
  background: linear-gradient(180deg, rgba(255, 59, 50, 0.18), rgba(255, 59, 50, 0.05)) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.04), 0 0 18px rgba(255, 59, 50, 0.10);
  clip-path: var(--clip);
  font-family: var(--font-display);
  letter-spacing: 0.03em;
  text-transform: none;
  color: #fff !important;
}

.account-hero__badges {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  margin-top: 12px;
}

.account-hero__badges h3 {
  margin: 0;
}

.account-hero__badges a,
.account-hero__actions a {
  color: inherit;
}

.account-hero__badges .badge,
.account-hero__bracket .badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 38px;
  padding: 0 14px;
  border-radius: 0 !important;
  clip-path: var(--clip);
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(255,255,255,0.05) !important;
  color: #eef2f8 !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.03);
}

.account-hero__badges .badge.bg-primary {
  border-color: rgba(255, 59, 50, 0.24);
  background: linear-gradient(180deg, rgba(255, 59, 50, 0.14), rgba(255, 59, 50, 0.04)) !important;
}

.account-hero__bracket {
  margin-top: 12px;
}

.account-hero__bracket h2 {
  margin: 0;
}

.account-hero__bracket .badge.text-bg-light {
  border-color: rgba(255,255,255,0.14);
  background: rgba(255,255,255,0.06) !important;
  color: #fff !important;
}

.account-hero__fields {
  display: grid;
  gap: 6px;
  margin-top: 12px;
}

.account-hero__fields h3 {
  margin: 0;
  font-size: 15px;
  font-weight: 500;
  color: var(--muted);
}

.account-hero__stats {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 20px;
  margin-top: 16px;
}

.account-hero__stats h2,
body[data-page="user-public"] .jumbotron > .container h2.text-center,
body[data-page="team-public"] .jumbotron > .container #team-place,
body[data-page="team-public"] .jumbotron > .container #team-score {
  position: relative;
  min-width: min(190px, 100%);
  margin: 0;
  padding-top: 14px;
  font-family: var(--font-display);
  font-size: clamp(18px, 2.8vw, 28px);
  line-height: 1.05;
  color: #fff;
}

.account-hero__stats h2::before,
body[data-page="user-public"] .jumbotron > .container h2.text-center::before,
body[data-page="team-public"] .jumbotron > .container #team-place::before,
body[data-page="team-public"] .jumbotron > .container #team-score::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  width: 72px;
  height: 1px;
  transform: translateX(-50%);
  background: linear-gradient(90deg, transparent, rgba(255, 59, 50, 0.65), transparent);
}

.account-hero__stats h2 small,
body[data-page="user-public"] .jumbotron > .container h2.text-center small,
body[data-page="team-public"] .jumbotron > .container #team-place small,
body[data-page="team-public"] .jumbotron > .container #team-score small {
  display: block;
  margin-top: 8px;
  color: var(--muted) !important;
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.account-hero__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  margin-top: 14px;
}

.account-hero__actions a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border: 1px solid rgba(255,255,255,0.08);
  background: rgba(255,255,255,0.03);
  clip-path: var(--clip);
  transition: transform .16s ease, border-color .16s ease, background .16s ease, box-shadow .16s ease;
}

.account-hero__actions a:hover,
.account-hero__actions a:focus-visible {
  border-color: rgba(255, 59, 50, 0.34);
  background: rgba(255, 59, 50, 0.08);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.05), 0 0 20px rgba(255, 59, 50, 0.10);
  transform: translateY(-1px);
}

.account-hero__actions i {
  padding: 0 !important;
  font-size: 20px !important;
}

.account-hero__frame hr {
  width: min(220px, 55%);
  margin: 12px auto 0;
}

.settings-shell {
  display: grid;
  grid-template-columns: minmax(220px, 260px) minmax(0, 1fr);
  gap: 22px;
  align-items: start;
}

.settings-shell__nav {
  padding: 18px;
  position: sticky;
  top: calc(var(--header-height, 72px) + 18px);
}

.settings-shell__content {
  min-width: 0;
}

.settings-shell__content > .tab-pane > .generic-page-frame {
  height: 100%;
}

.settings-nav {
  gap: 10px;
}

.settings-nav .nav-link {
  display: flex;
  align-items: center;
  min-height: 46px;
  padding: 0 16px;
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 0;
  background: rgba(255,255,255,0.03);
  clip-path: var(--clip);
  color: #eef2f8;
  font-family: var(--font-display);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  transition: transform .16s ease, border-color .16s ease, background .16s ease, box-shadow .16s ease;
}

.settings-nav .nav-link:hover,
.settings-nav .nav-link:focus-visible {
  color: #fff;
  border-color: rgba(255, 59, 50, 0.24);
  background: rgba(255, 59, 50, 0.08);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.03), 0 0 18px rgba(255, 59, 50, 0.08);
  transform: translateY(-1px);
}

.settings-nav .nav-link.active,
.settings-nav .show > .nav-link {
  color: #fff;
  border-color: rgba(255, 59, 50, 0.34);
  background: linear-gradient(180deg, rgba(255, 59, 50, 0.18), rgba(255, 59, 50, 0.05));
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.04), 0 0 20px rgba(255, 59, 50, 0.10);
}

.settings-form {
  display: grid;
  gap: 18px;
}

.settings-form__section {
  position: relative;
  padding: 20px;
  background: linear-gradient(180deg, rgba(11, 14, 20, 0.92), rgba(7, 10, 15, 0.96));
  border: 1px solid rgba(255,255,255,0.07);
  clip-path: var(--clip-wide);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.02);
}

.settings-form__section::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(255, 59, 50, 0.06), transparent 34%);
}

.settings-form__section > * {
  position: relative;
  z-index: 1;
}

.settings-form__section .panel-header {
  margin-bottom: 16px;
}

.settings-form__actions {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
}

.settings-form__actions--center {
  justify-content: center;
}

.settings-token-table {
  margin-top: 24px;
}

.settings-token-table .delete-token {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border: 1px solid rgba(255,255,255,0.08);
  background: rgba(255,255,255,0.03);
  clip-path: var(--clip);
  color: #eef2f8;
  transition: border-color .16s ease, background .16s ease, color .16s ease, transform .16s ease;
}

.settings-token-table .delete-token:hover,
.settings-token-table .delete-token:focus-visible {
  border-color: rgba(255, 59, 50, 0.32);
  background: rgba(255, 59, 50, 0.10);
  color: #fff;
  transform: translateY(-1px);
}

.directory-shell {
  display: grid;
  gap: 18px;
}

.directory-shell__summary,
.directory-pager {
  position: relative;
  padding: 18px 20px;
  background: linear-gradient(180deg, rgba(11, 14, 20, 0.94), rgba(7, 10, 15, 0.97));
  border: 1px solid rgba(255,255,255,0.08);
  clip-path: var(--clip-wide);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.02), var(--shadow-soft);
}

.directory-shell__summary::before,
.directory-pager::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(255, 59, 50, 0.07), transparent 30%);
}

.directory-shell__summary > *,
.directory-pager > * {
  position: relative;
  z-index: 1;
}

.directory-shell__summary p {
  margin: 10px 0 0;
  color: var(--muted);
}

.directory-search {
  display: grid;
  grid-template-columns: minmax(180px, 220px) minmax(0, 1fr) auto;
  gap: 14px;
  align-items: end;
}

.directory-search__field,
.directory-search__query,
.directory-search__action {
  min-width: 0;
}

.directory-search__submit {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  width: 100%;
}

.directory-shell__icon-cell {
  width: 68px;
  text-align: center;
}

.directory-shell .badge {
  vertical-align: middle;
}

.directory-pager__controls {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 14px;
}

.directory-pager__select {
  display: inline-flex;
  align-items: center;
  gap: 12px;
}

.directory-pager__select span {
  color: var(--muted);
  font-size: 13px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.directory-pager__select .form-select {
  min-width: 92px;
}

.onboarding-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 20px;
}

.onboarding-card {
  display: flex;
  flex-direction: column;
  gap: 14px;
  min-height: 100%;
}

.onboarding-card h2 {
  margin: 0;
  color: #fff;
  font-family: var(--font-display);
  font-size: clamp(22px, 2.8vw, 30px);
  line-height: 1.05;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.onboarding-card p {
  margin: 0;
  color: var(--muted);
}

.onboarding-card__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: auto;
}

.onboarding-card__actions > a,
.onboarding-card__action {
  flex: 1 1 180px;
  justify-content: center;
  text-align: center;
}

.team-flow-shell {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 320px);
  gap: 20px;
  align-items: start;
}

.team-flow-shell__main,
.team-flow-shell__aside {
  min-width: 0;
}

.team-flow-shell__aside {
  display: grid;
  gap: 14px;
  padding: 18px;
  position: sticky;
  top: calc(var(--header-height, 72px) + 18px);
}

.team-flow-shell__aside p {
  margin: 0;
  color: var(--muted);
}

.team-flow-shell__aside-link {
  width: 100%;
  justify-content: center;
  text-align: center;
}

.invite-shell {
  max-width: 760px;
  margin: 0 auto;
}

.invite-shell p {
  margin: 12px auto 0;
  max-width: 620px;
  color: var(--muted);
}

.invite-shell__form {
  margin-top: 20px;
}

.invite-shell__submit {
  min-width: min(260px, 100%);
}

.account-page > .account-grid-row {
  --bs-gutter-x: 18px;
  --bs-gutter-y: 18px;
  margin-top: 18px;
}

.account-grid-row > [class*="col-"] {
  position: relative;
  z-index: 0;
  padding: 22px 22px 20px;
  background: linear-gradient(180deg, rgba(11, 14, 20, 0.94), rgba(7, 10, 15, 0.97));
  border: 1px solid rgba(255,255,255,0.08);
  clip-path: var(--clip-wide);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.02), var(--shadow-soft);
}

.account-grid-row > [class*="col-"]::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(255, 59, 50, 0.07), transparent 30%);
}

.account-grid-row > [class*="col-"] > * {
  position: relative;
  z-index: 1;
}

.account-grid-row h3 {
  margin-top: 0;
  margin-bottom: 16px;
  color: #fff;
  font-family: var(--font-display);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.account-grid-row .table {
  margin-bottom: 0;
}

.account-grid-row .table thead th {
  color: var(--muted);
  border-bottom-color: rgba(255, 255, 255, 0.12);
}

.account-grid-row .table tbody th,
.account-grid-row .table tbody td {
  border-color: rgba(255, 255, 255, 0.08);
  background: transparent;
}

.account-grid-row .table-striped > tbody > tr:nth-of-type(odd) > * {
  background: rgba(255, 255, 255, 0.035);
}

.account-grid-row .table-striped > tbody > tr:hover > * {
  background: rgba(255, 59, 50, 0.08);
}

.account-grid-row .progress {
  height: 12px;
  margin-bottom: 14px;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  clip-path: var(--clip);
}

.account-score-graph,
.account-grid-row--graphs #score-graph {
  min-height: 280px;
  margin-bottom: 0;
}

.account-radar-panel {
  display: grid;
  grid-template-columns: 1fr;
  gap: 18px;
  justify-items: center;
  padding: 22px 24px 18px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.025), rgba(255, 255, 255, 0.01)),
    rgba(8, 10, 14, 0.82);
  clip-path: var(--clip);
}

.account-radar-panel__toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  width: 100%;
}

.account-radar-panel__modes {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.account-radar-panel__mode {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  padding: 0 12px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: rgba(255, 255, 255, 0.03);
  clip-path: var(--clip);
  color: rgba(233, 239, 248, 0.84);
  font-family: var(--font-display);
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  transition: border-color .16s ease, background .16s ease, color .16s ease, box-shadow .16s ease;
}

.account-radar-panel__mode:hover,
.account-radar-panel__mode:focus-visible {
  color: #fff;
  border-color: rgba(255, 59, 50, 0.24);
  background: rgba(255, 59, 50, 0.08);
}

.account-radar-panel__mode.is-active {
  color: #fff;
  border-color: rgba(255, 59, 50, 0.34);
  background: linear-gradient(180deg, rgba(255, 59, 50, 0.18), rgba(255, 59, 50, 0.05));
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.04), 0 0 18px rgba(255, 59, 50, 0.10);
}

.account-radar-shell {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 500px;
  padding: 12px 8px;
  border: 1px solid rgba(255, 255, 255, 0.05);
  background:
    radial-gradient(circle at center, rgba(255, 255, 255, 0.035), transparent 72%),
    rgba(255, 255, 255, 0.012);
  clip-path: var(--clip);
}

.account-radar-shell__canvas {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
}

.account-radar {
  width: min(100%, 760px);
  height: auto;
  overflow: visible;
}

.account-radar__ring {
  fill: rgba(255, 255, 255, 0.01);
  stroke: rgba(255, 255, 255, 0.11);
  stroke-width: 1;
}

.account-radar__axis {
  stroke: rgba(255, 255, 255, 0.08);
  stroke-width: 1;
  stroke-dasharray: 4 6;
}

.account-radar__origin {
  fill: rgba(255, 255, 255, 0.38);
}

.account-radar__shape {
  fill: rgba(220, 34, 59, 0.22);
  stroke: rgba(255, 41, 79, 0.94);
  stroke-width: 2;
}

.account-radar__point {
  stroke: rgba(7, 10, 14, 0.92);
  stroke-width: 2;
}

.account-radar__label {
  fill: rgba(240, 243, 247, 0.92);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0;
}

.account-radar__label.is-muted {
  fill: rgba(240, 243, 247, 0.54);
}

.account-radar-panel__chips {
  display: grid;
  width: 100%;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px 12px;
}

.account-radar-panel__chip {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid rgba(255, 255, 255, 0.06);
  background: rgba(255, 255, 255, 0.02);
  clip-path: var(--clip);
}

.account-radar-panel__chip.is-muted {
  opacity: 0.62;
}

.account-radar-panel__chip-dot {
  width: 9px;
  height: 9px;
  border-radius: 999px;
}

.account-radar-panel__chip-label {
  min-width: 0;
  color: var(--ink);
  font-size: 0.92rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.account-radar-panel__chip-value {
  color: rgba(255, 255, 255, 0.68);
  font-size: 0.83rem;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

@media (min-width: 768px) {
  .account-grid-row--graphs {
    row-gap: 18px;
    column-gap: 24px;
  }

  .account-grid-row--graphs > .col-md-6.d-md-block.d-lg-block {
    flex: 0 0 calc(50% - 12px);
    max-width: calc(50% - 12px);
  }

  .account-grid-row--graphs > .col-md-12.d-none.d-md-block.d-lg-block {
    flex: 0 0 100%;
    max-width: 100%;
  }
}

@media (max-width: 991.98px) {
  .account-radar-panel__toolbar {
    align-items: flex-start;
    flex-direction: column;
  }

  .account-radar-panel__modes {
    justify-content: flex-start;
  }

  .account-radar-shell {
    min-height: 420px;
  }

  .settings-shell,
  .team-flow-shell {
    grid-template-columns: 1fr;
  }

  .settings-shell__nav,
  .team-flow-shell__aside {
    position: static;
  }

  .directory-search {
    grid-template-columns: 1fr;
  }

  .directory-pager__controls {
    justify-content: center;
  }
}

@media (max-width: 767.98px) {
  .settings-shell__nav,
  .directory-shell__summary,
  .directory-pager,
  .team-flow-shell__aside {
    padding: 16px;
  }

  .settings-form__section {
    padding: 16px;
  }

  .directory-pager__select {
    width: 100%;
    justify-content: space-between;
  }

  .settings-form__actions,
  .settings-form__actions--center,
  .onboarding-card__actions {
    justify-content: stretch;
  }

  .settings-form__actions > .access-btn,
  .settings-form__actions > .outline-btn,
  .onboarding-card__actions > a,
  .onboarding-card__action,
  .team-flow-shell__aside-link,
  .invite-shell__submit {
    width: 100%;
  }
}

@media (max-width: 1199.98px) {
  .account-radar-panel__chips {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 899.98px) {
  .account-radar-panel__chips {
    grid-template-columns: 1fr;
  }
}

.account-grid-row--empty {
  position: relative;
  margin-top: 18px;
  padding: 26px;
  align-items: center;
  justify-content: center;
  background: linear-gradient(180deg, rgba(11, 14, 20, 0.94), rgba(7, 10, 15, 0.97));
  border: 1px solid rgba(255,255,255,0.08);
  clip-path: var(--clip-wide);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.02), var(--shadow-soft);
}

.account-grid-row--empty::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(255, 59, 50, 0.07), transparent 30%);
}

.account-grid-row--empty h3 {
  position: relative;
  z-index: 1;
  margin: 0;
}

.toast-container,
.offcanvas-header,
.offcanvas-body,
.list-group,
.list-group-flush {
  position: relative;
  z-index: 1;
}

/* responsive */
@media (max-width: 1100px) {
  .challenge-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 980px) {
  .topbar-main {
    grid-template-columns: auto auto;
    min-height: 72px;
  }

  .topbar-toggle {
    display: inline-flex;
  }

  .topbar-panel {
    display: none;
    grid-column: 1 / -1;
    grid-template-columns: 1fr;
    gap: 10px;
    padding: 0 0 12px;
  }

  .topbar-panel.is-open {
    display: grid;
  }

  .primary-nav {
    width: 100%;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 10px;
    padding-top: 4px;
  }

  .primary-link {
    min-height: 38px;
    width: 100%;
    gap: 8px;
    justify-content: flex-start;
  }

  .primary-link--page {
    max-width: none;
  }

  .primary-link__label {
    overflow: visible;
    text-overflow: clip;
    white-space: normal;
  }

  .primary-link em {
    display: inline-flex;
    flex: 0 0 auto;
  }

  .topbar-cta {
    width: 100%;
    justify-content: flex-start;
  }

  .topbar-cta--guest,
  .topbar-cta--authed {
    flex-direction: column;
    align-items: stretch;
  }

  .topbar-cta__lang {
    width: 100%;
    justify-content: flex-start;
  }

  .topbar-cta .access-btn {
    width: 100%;
    justify-content: center;
  }

  .topbar-cta--authed {
    display: none;
  }

  .utility-bar {
    display: none;
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
    padding: 0 0 12px;
  }

  .topbar.is-nav-open .utility-bar {
    display: flex;
  }

  .utility-links {
    width: 100%;
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
    box-sizing: border-box;
    padding-left: 12px;
  }

  .utility-mobile-actions {
    display: flex;
    width: 100%;
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
    margin-top: 4px;
    padding-top: 10px;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
  }

  .utility-mobile-actions .access-btn {
    width: 100%;
    justify-content: center;
  }

  .utility-link,
  .lang-toggle,
  .theme-switch {
    min-height: 38px;
    width: 100%;
    justify-content: flex-start;
  }

  .utility-link--page {
    max-width: none;
  }

  .utility-link__label {
    overflow: visible;
    text-overflow: clip;
    white-space: normal;
  }

  .lang-toggle {
    justify-content: center;
  }

  .topbar-cta__lang .lang-toggle {
    width: auto;
    min-width: 56px;
    flex: 0 0 auto;
  }

  .container {
    width: min(1180px, calc(100vw - 32px));
  }

  .auth-switch {
    grid-template-columns: 1fr;
  }

  .home-welcome-grid,
  .home-pillars,
  .home-ops-card__body {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  .hero {
    padding-top: 54px;
  }

  .hero-inner {
    min-height: 340px;
  }

  .hero-mark {
    width: 78vw;
    top: 42px;
  }

  .hero-title {
    font-size: 36px;
  }

  .hero-title--home {
    gap: 6px;
    line-height: 1.06;
  }

  .hero-title--home-primary {
    font-size: clamp(20px, 6.6vw, 30px);
  }

  .hero-title--home-secondary {
    font-size: clamp(18px, 5vw, 26px);
    letter-spacing: 0.1em;
  }

  .hero-subtitle,
  .page-subtitle {
    font-size: 13px;
  }

  .challenge-grid {
    grid-template-columns: 1fr;
  }

  .operation-card__title {
    font-size: 22px;
  }

  .footer-inner,
  .footer-socials {
    flex-direction: column;
    align-items: flex-start;
  }

  .home-brief-card,
  .home-flow-card,
  .home-pillar,
  .home-ops-card {
    padding: 18px;
  }
}

@media (max-width: 560px) {
  .container {
    width: min(1180px, calc(100vw - 22px));
  }

  .brand-copy span {
    display: none;
  }

  .utility-links,
  .utility-controls {
    gap: 8px 10px;
  }

  .board-shell,
  .generic-page-frame,
  .table-wrap {
    padding: 18px;
  }

  #challenge-window .modal-dialog {
    max-width: calc(100vw - 16px);
  }
}


/* hard overrides for bootstrap widgets */
.btn,
.btn-group > .btn,
.btn-group-vertical > .btn,
.form-control,
.form-select,
.input-group-text,
.dropdown-toggle,
.challenge-button,
input[type="submit"],
input[type="button"],
button[type="submit"] {
  border-radius: 0 !important;
}

.btn,
.btn-group > .btn,
.btn-group-vertical > .btn,
.input-group-text,
input[type="submit"],
input[type="button"],
button[type="submit"] {
  clip-path: var(--clip) !important;
}


/* compatibility fixes for current core challenge/scoreboard pages */
body.modal-open,
body.modal-open .page-shell,
body.modal-open .site-main,
body.modal-open .topbar,
body.modal-open .footer,
body.modal-open main,
body.modal-open .content-shell {
  filter: none !important;
  -webkit-filter: none !important;
}

#challenge-window,
#chal-window {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

#challenge-window .btn,
#challenge-window input[type="submit"],
#chal-window .btn,
#chal-window input[type="submit"] {
  border-radius: 0 !important;
  clip-path: var(--clip);
}

/* some current core builds render challenge and scoreboard controls with these classes */
.challenge-button,
.challenge-btn,
.chal-button,
.scoreboard-button,
.navbar .dropdown-toggle,
.dropdown-toggle {
  border-radius: 0 !important;
}

/* hidden compatibility stub */
.theme-switcher-stub {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
  opacity: 0;
  pointer-events: none;
}

/* board runtime states */
.board-error {
  min-height: 220px;
  display: grid;
  place-items: center;
  text-align: center;
  gap: 10px;
  padding: 24px;
}

.challenge-locked .operation-card__status {
  color: var(--amber);
}

.challenge-locked .operation-card__icon {
  border-color: rgba(244, 187, 113, 0.22);
  color: var(--amber);
}

/* custom challenge modal */
body.challenge-modal-open {
  overflow: hidden;
}

.challenge-lightbox[hidden] {
  display: none !important;
}

.challenge-lightbox {
  position: fixed;
  inset: 0;
  z-index: 1200;
}

.challenge-lightbox__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(2, 4, 6, 0.82);
}

.challenge-lightbox__dialog {
  position: relative;
  z-index: 1;
  width: min(860px, calc(100vw - 36px));
  max-height: calc(100vh - 72px);
  margin: 36px auto;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: linear-gradient(180deg, rgba(8, 11, 16, 0.985), rgba(4, 6, 10, 0.985));
  clip-path: var(--clip-wide);
  box-shadow: 0 26px 72px rgba(0, 0, 0, 0.72), 0 0 32px rgba(255, 59, 50, 0.10);
  overflow: hidden;
}

.challenge-lightbox__body {
  max-height: calc(100vh - 72px);
  overflow: auto;
  padding: 24px 24px 28px;
}

.challenge-lightbox__close {
  position: absolute;
  top: 12px;
  right: 14px;
  z-index: 3;
  width: 40px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  background: transparent;
  color: rgba(255, 255, 255, 0.72);
  font-size: 30px;
  line-height: 1;
  box-shadow: none;
  clip-path: none;
}

.challenge-lightbox__close:hover {
  color: #fff;
  transform: none;
  box-shadow: none;
}

.challenge-modal-loading,
.challenge-modal-error {
  min-height: 280px;
  display: grid;
  place-items: center;
  text-align: center;
  gap: 10px;
}

.challenge-modal-tabs {
  display: inline-flex;
  gap: 10px;
  margin-bottom: 18px;
  padding-right: 56px;
}

.challenge-modal-tab {
  display: inline-flex;
  align-items: center;
  min-height: 42px;
  padding: 0 18px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: rgba(255, 255, 255, 0.03);
  color: #d9e0ea;
  font-family: var(--font-display);
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  clip-path: var(--clip);
  transition: border-color .16s ease, background .16s ease, color .16s ease;
}

.challenge-modal-tab.is-active {
  border-color: rgba(255, 59, 50, 0.42);
  background: linear-gradient(180deg, rgba(255, 59, 50, 0.18), rgba(255, 59, 50, 0.05));
  color: #fff;
}

.challenge-modal-panel {
  display: none;
}

.challenge-modal-panel.is-active {
  display: block;
}

.challenge-modal-header {
  text-align: center;
  padding-top: 6px;
}

.challenge-modal-kicker,
.challenge-modal-label,
.challenge-solve-rank {
  font-family: var(--font-display);
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.challenge-modal-kicker {
  color: var(--muted);
}

.challenge-modal-title {
  margin: 12px 0 0;
  font-size: clamp(34px, 5vw, 54px);
  line-height: 0.96;
  color: #fff;
  overflow-wrap: anywhere;
}

.challenge-modal-points {
  margin-top: 12px;
  font-size: 28px;
  color: #e8edf6;
}

.challenge-modal-meta {
  margin-top: 10px;
  display: flex;
  justify-content: center;
  gap: 12px;
  flex-wrap: wrap;
  color: var(--muted);
  font-size: 12px;
}

.challenge-modal-section {
  margin-top: 22px;
}

.challenge-modal-label {
  margin-bottom: 10px;
  color: var(--muted);
}

.challenge-modal-copy,
.challenge-console,
.challenge-solves-list {
  padding: 18px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: rgba(255, 255, 255, 0.025);
  clip-path: var(--clip);
}

.challenge-modal-copy {
  color: #eef2f8;
}

.challenge-modal-copy p:last-child {
  margin-bottom: 0;
}

.challenge-console {
  font-family: var(--font-mono);
  white-space: pre-wrap;
  word-break: break-word;
  color: #eaf0fb;
}

.challenge-file-list,
.challenge-tag-list {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.challenge-file-list {
  padding: 14px;
  border: 1px solid rgba(255, 59, 50, 0.18);
  background: linear-gradient(180deg, rgba(43, 12, 12, 0.22), rgba(8, 10, 14, 0.92));
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.03);
  clip-path: var(--clip-wide);
}

.challenge-file-link {
  min-height: 40px;
  padding: 0 14px;
  border: 1px solid rgba(255, 59, 50, 0.34);
  background: linear-gradient(180deg, rgba(255, 59, 50, 0.18), rgba(255, 59, 50, 0.05));
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.04), 0 0 18px rgba(255, 59, 50, 0.10);
  color: #f4f7fc !important;
}

.challenge-file-link:visited,
.challenge-file-link:hover,
.challenge-file-link:focus-visible {
  color: #fff !important;
}

.challenge-file-link:hover,
.challenge-file-link:focus-visible {
  border-color: rgba(255, 92, 84, 0.52);
  background: linear-gradient(180deg, rgba(255, 59, 50, 0.24), rgba(255, 59, 50, 0.09));
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.05), 0 0 24px rgba(255, 59, 50, 0.16);
}

.challenge-submit-form {
  margin-top: 22px;
}

.challenge-submit-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
}

.challenge-submit-row .form-control {
  width: 100%;
}

.challenge-submit-feedback {
  min-height: 22px;
  margin-top: 10px;
  font-size: 13px;
  color: var(--muted);
}

.challenge-submit-feedback.is-success {
  color: var(--green);
}

.challenge-submit-feedback.is-error {
  color: var(--red-soft);
}

.challenge-submit-feedback.is-info {
  color: #e4ebf6;
}

.challenge-solve-row {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 10px 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.challenge-solve-row:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}

.challenge-solve-row:first-child {
  padding-top: 0;
}

.challenge-solve-name {
  overflow-wrap: anywhere;
}

.challenge-solve-date {
  color: var(--muted);
  font-size: 12px;
  text-align: right;
}

@media (max-width: 720px) {
  .challenge-lightbox__dialog {
    width: calc(100vw - 20px);
    margin: 10px auto;
    max-height: calc(100vh - 20px);
  }

  .challenge-lightbox__body {
    max-height: calc(100vh - 20px);
    padding: 18px 16px 20px;
  }

  .challenge-modal-tabs {
    display: grid;
    grid-template-columns: 1fr 1fr;
    width: 100%;
    padding-right: 42px;
  }

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

  .challenge-solve-row {
    grid-template-columns: 28px 1fr;
  }

  .challenge-solve-date {
    grid-column: 2;
    text-align: left;
  }
}

/* v10 stability overrides */
.theme-switcher-stub {
  display: none !important;
}

body::after {
  opacity: 0.04;
}

.hero-title,
.page-title {
  text-shadow: none;
}

.page-hero,
.content-shell,
.main-section {
  background: transparent;
}

.brand-badge,
.hero-mark {
  filter: none;
}

#challenge-window .challenge-modal-tabs {
  display: flex;
  gap: 10px;
  align-items: center;
}

#challenge-window .challenge-modal-tabs .nav-link {
  min-height: 40px;
  padding: 0 16px;
}

#challenge-window .btn-close {
  font-size: 28px;
  line-height: 1;
  width: 42px;
  height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

#challenge-window .challenge-hero-block {
  display: grid;
  gap: 10px;
  justify-items: center;
  text-align: center;
  margin-bottom: 18px;
}

#challenge-window .challenge-score {
  font-size: 42px;
  line-height: 1;
  color: #fff;
}

#challenge-window .challenge-meta-inline {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
}

#challenge-window .challenge-tab-panel {
  gap: 18px;
}

#challenge-window .tab-content > .challenge-tab-panel {
  display: none;
}

#challenge-window .tab-content > .challenge-tab-panel.active {
  display: grid;
}

#challenge-window .challenge-tab-panel[hidden] {
  display: none !important;
}

#challenge-window .challenge-response {
  margin-top: 12px;
  min-height: 24px;
  color: var(--muted);
}

#challenge-window .challenge-response.is-success {
  color: var(--green);
}

#challenge-window .challenge-response.is-error {
  color: var(--red-soft);
}

#challenge-window .challenge-response--static {
  min-height: 0;
}

#challenge-window .challenge-hint-card {
  display: grid;
  gap: 10px;
}

#challenge-window .challenge-hint-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

#challenge-window .challenge-hint-copy {
  color: #d7dde7;
  line-height: 1.7;
}

#challenge-window .challenge-submit .challenge-actions {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: stretch;
}

#challenge-window .challenge-submit .cta-btn,
#challenge-window .challenge-submit .btn {
  min-width: 200px;
}

#challenge-window .challenge-submit input {
  width: 100%;
}

#challenge-window .challenge-solves p {
  margin: 0;
}

#challenge-window .modal-dialog {
  max-width: min(880px, calc(100vw - 32px));
  margin: 18px auto;
}

#challenge-window .challenge-modal-shell {
  background: linear-gradient(180deg, rgba(12, 15, 21, 0.99), rgba(7, 10, 15, 0.995)) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.04), 0 20px 48px rgba(0,0,0,0.44) !important;
}

#challenge-window .challenge-modal-body {
  max-height: calc(100vh - 36px);
  overflow-y: auto;
  padding: 16px 16px 18px !important;
}

#challenge-window .challenge-modal-topbar {
  margin-bottom: 12px;
  padding-right: 54px;
}

#challenge-window .challenge-modal-tabs {
  flex-wrap: wrap;
  gap: 6px;
}

#challenge-window .challenge-modal-tabs .nav-link {
  min-height: 36px;
  padding: 0 12px;
  border-color: rgba(255,255,255,0.08);
  background: rgba(255,255,255,0.025);
  font-size: 10px;
  letter-spacing: 0.08em;
  box-shadow: none;
}

#challenge-window .challenge-modal-tabs .nav-link.active,
#challenge-window .challenge-modal-tabs .show > .nav-link {
  border-color: rgba(255, 59, 50, 0.24);
  background: rgba(255, 59, 50, 0.08);
  box-shadow: none;
}

#challenge-window .challenge-modal-tabset {
  display: grid;
  gap: 16px;
}

#challenge-window .challenge-hero-block {
  display: grid;
  gap: 8px;
  margin-bottom: 12px;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}

#challenge-window .challenge-modal-kicker {
  font-size: 10px;
  letter-spacing: 0.10em;
  color: #9da8b8;
}

#challenge-window .challenge-modal-title {
  margin: 0;
  max-width: 720px;
  font-size: clamp(24px, 3.3vw, 34px);
  line-height: 1.08;
  text-wrap: balance;
}

#challenge-window .challenge-score {
  display: inline-flex;
  align-items: baseline;
  width: fit-content;
  min-height: 34px;
  gap: 6px;
  padding: 0 10px;
  border: 1px solid rgba(255,255,255,0.08);
  background: rgba(255,255,255,0.025);
  clip-path: var(--clip);
  font-family: var(--font-display);
  font-size: 17px;
}

#challenge-window .challenge-score small {
  color: var(--muted);
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

#challenge-window .challenge-meta-inline {
  justify-content: flex-start;
  gap: 8px;
}

#challenge-window .challenge-summary-chip {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 28px;
  padding: 0 9px;
  border: 1px solid rgba(255,255,255,0.07);
  background: rgba(255,255,255,0.02);
  clip-path: var(--clip);
  color: #eaf0f8;
  font-size: 10px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

#challenge-window .challenge-summary-chip--tag {
  border-color: rgba(255,255,255,0.07);
  background: rgba(255,255,255,0.018);
  color: #d7dee8;
}

#challenge-window .challenge-layout {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  align-items: start;
}

#challenge-window .challenge-submit-card,
#challenge-window .challenge-table-wrap,
#challenge-window .challenge-modal-copy,
#challenge-window .challenge-console,
#challenge-window .challenge-hint-card {
  position: relative;
  border: 1px solid rgba(255,255,255,0.07);
  background: rgba(18, 21, 28, 0.92);
  box-shadow: none;
  clip-path: var(--clip-card-final);
}

#challenge-window .challenge-submit-card::before,
#challenge-window .challenge-table-wrap::before,
#challenge-window .challenge-modal-copy::before,
#challenge-window .challenge-console::before,
#challenge-window .challenge-hint-card::before {
  display: none;
}

#challenge-window .challenge-submit-card > *,
#challenge-window .challenge-table-wrap > *,
#challenge-window .challenge-modal-copy > *,
#challenge-window .challenge-console > *,
#challenge-window .challenge-hint-card > * {
  position: relative;
  z-index: 1;
}

#challenge-window .challenge-modal-section {
  margin-top: 0;
  display: grid;
  gap: 8px;
}

#challenge-window .challenge-modal-label {
  margin-bottom: 0;
  font-size: 10px;
  letter-spacing: 0.10em;
  color: #9aa5b6;
}

#challenge-window .challenge-submit-card {
  padding: 12px;
}

#challenge-window .challenge-modal-copy,
#challenge-window .challenge-console {
  padding: 16px;
}

#challenge-window .challenge-modal-copy {
  background: rgba(28, 32, 39, 0.96);
  border-color: rgba(255,255,255,0.06);
  overflow: hidden;
}

#challenge-window .challenge-modal-copy--rich,
#challenge-window .challenge-modal-copy--rich p,
#challenge-window .challenge-modal-copy--rich li,
#challenge-window .challenge-modal-copy--rich dd,
#challenge-window .challenge-modal-copy--rich dt,
#challenge-window .challenge-modal-copy--rich blockquote {
  color: #d7dde7 !important;
  line-height: 1.72;
  overflow-wrap: anywhere;
  word-break: break-word;
}

#challenge-window .challenge-modal-copy--rich {
  font-size: 15.5px;
  max-width: 100%;
  overflow-x: hidden;
}

#challenge-window .challenge-modal-copy--rich > * {
  width: min(100%, 720px);
  margin-left: auto;
  margin-right: auto;
}

#challenge-window .challenge-modal-copy--rich > :first-child {
  margin-top: 0 !important;
}

#challenge-window .challenge-modal-copy--rich > :last-child {
  margin-bottom: 0 !important;
}

#challenge-window .challenge-modal-copy--rich a {
  color: #eef3fb !important;
  text-decoration: underline;
  text-decoration-color: rgba(255, 59, 50, 0.42);
}

#challenge-window .challenge-modal-copy--rich h1,
#challenge-window .challenge-modal-copy--rich h2,
#challenge-window .challenge-modal-copy--rich h3,
#challenge-window .challenge-modal-copy--rich h4,
#challenge-window .challenge-modal-copy--rich h5,
#challenge-window .challenge-modal-copy--rich h6,
#challenge-window .challenge-modal-copy--rich strong,
#challenge-window .challenge-modal-copy--rich b,
#challenge-window .challenge-modal-copy--rich code {
  color: #f3f6fb !important;
}

#challenge-window .challenge-modal-copy--rich p,
#challenge-window .challenge-modal-copy--rich ul,
#challenge-window .challenge-modal-copy--rich ol,
#challenge-window .challenge-modal-copy--rich blockquote,
#challenge-window .challenge-modal-copy--rich pre,
#challenge-window .challenge-modal-copy--rich table {
  margin-bottom: 14px;
}

#challenge-window .challenge-modal-copy--rich code:not(pre code) {
  padding: 2px 6px;
  border: 1px solid rgba(255,255,255,0.06);
  background: rgba(255,255,255,0.05);
}

#challenge-window .challenge-modal-copy--rich blockquote {
  padding-left: 14px;
  border-left: 2px solid rgba(255,255,255,0.12);
}

#challenge-window .challenge-modal-copy--rich pre,
#challenge-window .challenge-modal-copy--rich .codehilite,
#challenge-window .challenge-modal-copy--rich .highlight {
  padding: 14px;
  border: 1px solid rgba(255,255,255,0.06);
  background: rgba(11, 14, 20, 0.9);
  max-width: 100%;
  overflow-x: auto;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  word-break: break-word;
  clip-path: var(--clip);
}

#challenge-window .challenge-modal-copy--rich img,
#challenge-window .challenge-modal-copy--rich svg,
#challenge-window .challenge-modal-copy--rich canvas,
#challenge-window .challenge-modal-copy--rich video {
  display: block;
  max-width: 100%;
  height: auto;
  margin-top: 12px;
  margin-bottom: 12px;
}

#challenge-window .challenge-modal-copy--rich iframe {
  display: block;
  width: 100%;
  max-width: 100%;
  min-height: 280px;
}

#challenge-window .challenge-modal-copy--rich table {
  width: 100%;
  max-width: 100%;
  table-layout: fixed;
}

#challenge-window .challenge-modal-copy--rich ul,
#challenge-window .challenge-modal-copy--rich ol {
  padding-left: 24px;
}

#challenge-window .challenge-modal-copy--rich th,
#challenge-window .challenge-modal-copy--rich td {
  overflow-wrap: anywhere;
  word-break: break-word;
}

#challenge-window .challenge-submit-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

#challenge-window .challenge-attempts {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  min-height: 0;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  clip-path: none;
  color: #e8eef8;
}

#challenge-window .challenge-attempts span {
  color: var(--muted);
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

#challenge-window .challenge-attempts strong {
  color: #fff;
  font-family: var(--font-mono);
  font-size: 13px;
}

#challenge-window .challenge-submit-form {
  margin-top: 8px;
}

#challenge-window .challenge-submit-row {
  grid-template-columns: minmax(0, 1fr) 148px;
  gap: 8px;
  align-items: stretch;
}

#challenge-window .challenge-input-field,
#challenge-window .challenge-submit-button {
  margin: 0;
  min-height: 44px;
}

#challenge-window .challenge-submit-button {
  width: 100%;
}

#challenge-window .challenge-response-box {
  display: grid;
  gap: 10px;
  max-height: min(38vh, 280px);
  overflow-y: auto;
  margin-top: 10px;
  padding: 12px;
  border: 1px solid rgba(255,255,255,0.08);
  background: rgba(255,255,255,0.024);
  clip-path: var(--clip-card-final);
}

#challenge-window .challenge-response-box.is-success {
  border-color: rgba(134,255,152,0.22);
  background: rgba(134,255,152,0.05);
}

#challenge-window .challenge-response-box.is-info {
  border-color: rgba(255,255,255,0.10);
  background: rgba(255,255,255,0.04);
}

#challenge-window .challenge-response-box.is-error {
  border-color: rgba(255,59,50,0.22);
  background: rgba(255,59,50,0.06);
}

#challenge-window .challenge-response-box.is-warning {
  border-color: rgba(244, 187, 113, 0.24);
  background: rgba(244, 187, 113, 0.07);
}

#challenge-window .challenge-response-copy {
  color: #fff;
  line-height: 1.5;
}

#challenge-window .challenge-response-copy strong {
  font-size: 14px;
  font-weight: 600;
}

#challenge-window .challenge-post-actions {
  display: grid;
  gap: 8px;
}

#challenge-window .challenge-post-actions__button {
  width: 100%;
  justify-content: center;
  min-height: 40px;
  font-size: 11px;
}

#challenge-window .challenge-share-panel {
  display: grid;
  gap: 8px;
}

#challenge-window .challenge-share-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

#challenge-window .challenge-share-actions__icon {
  width: 38px;
  height: 38px;
  padding: 0;
  justify-content: center;
}

#challenge-window .challenge-rating-panel {
  display: grid;
  gap: 8px;
  padding-top: 8px;
  border-top: 1px solid rgba(255,255,255,0.08);
}

#challenge-window .challenge-rating-panel__title {
  color: var(--muted);
  font-size: 11px;
  letter-spacing: 0.10em;
  text-transform: uppercase;
}

#challenge-window .challenge-rating-buttons {
  display: flex;
  gap: 8px;
}

#challenge-window .challenge-rating-button {
  width: 42px;
  height: 42px;
  padding: 0;
  justify-content: center;
}

#challenge-window .challenge-rating-button.is-active {
  color: #fff;
}

#challenge-window .challenge-rating-buttons .challenge-rating-button:first-child.is-active {
  border-color: rgba(134,255,152,0.26);
  background: rgba(134,255,152,0.08);
}

#challenge-window .challenge-rating-buttons .challenge-rating-button:last-child.is-active {
  border-color: rgba(255,59,50,0.26);
  background: rgba(255,59,50,0.08);
}

#challenge-window .challenge-rating-panel__thanks {
  color: var(--green);
  font-size: 13px;
}

#challenge-window .challenge-hint-list {
  display: grid;
  gap: 8px;
}

#challenge-window .challenge-hint-card details {
  padding: 12px;
}

#challenge-window .challenge-hint-card summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  cursor: pointer;
  color: #fff;
  font-family: inherit;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0;
}

#challenge-window .challenge-hint-cost {
  color: var(--muted);
  font-family: var(--font-mono);
  font-size: 11px;
}

#challenge-window .challenge-hint-copy {
  margin-top: 10px;
  color: #dce3ee;
  line-height: 1.68;
}

#challenge-window .challenge-file-list {
  display: grid;
  gap: 8px;
}

#challenge-window .challenge-file-link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-height: 38px;
  width: 100%;
  padding: 0 12px;
  border-color: rgba(255,255,255,0.08);
  background: rgba(255,255,255,0.02);
  box-shadow: none;
}

#challenge-window .challenge-table-wrap {
  padding: 8px;
  background: rgba(18, 21, 28, 0.92);
}

#challenge-window .challenge-table-wrap .table {
  margin-bottom: 0;
}

#challenge-window .challenge-table-wrap code {
  color: #fff;
}

.utility-link .utility-badge {
  margin-left: 8px;
}

@media (max-width: 720px) {
  #challenge-window .modal-dialog {
    max-width: calc(100vw - 20px);
  }

  #challenge-window .challenge-modal-body {
    max-height: calc(100vh - 20px);
    padding: 14px 12px 16px !important;
  }

  #challenge-window .challenge-modal-topbar {
    padding-right: 42px;
  }

  #challenge-window .challenge-modal-title {
    font-size: clamp(22px, 7vw, 28px);
  }

  #challenge-window .challenge-submit-head {
    align-items: flex-start;
    flex-direction: column;
  }

  #challenge-window .challenge-submit-row {
    grid-template-columns: 1fr;
  }

  #challenge-window .challenge-share-actions {
    justify-content: flex-start;
  }

  #challenge-window .challenge-hint-card summary {
    align-items: flex-start;
    flex-direction: column;
  }
}


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


/* v15 scoreboard + stability */
.scoreboard-shell {
  padding: 22px;
}

.scoreboard-shell__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 18px;
}

.scoreboard-shell__note {
  margin: 8px 0 0;
  color: var(--muted);
  font-size: 13px;
}

.scoreboard-wrap {
  padding: 10px;
}

.scoreboard-empty,
.scoreboard-error {
  padding: 26px;
}

.scoreboard-empty p,
.scoreboard-error p {
  margin: 10px 0 0;
}

.scoreboard-table tbody th,
.scoreboard-table tbody td {
  color: #eef3fb !important;
  vertical-align: middle;
}

.scoreboard-table tbody tr:first-child th,
.scoreboard-table tbody tr:first-child td {
  color: #ffffff !important;
}

.scoreboard-table tbody tr:first-child {
  background: rgba(255, 59, 50, 0.05);
}

.scoreboard-table td a {
  color: #ffffff !important;
}

main .nav-link,
main .nav-tabs .nav-link,
main .nav-pills .nav-link,
main .list-group-item,
main .list-group-item a,
main .card a,
main .table a,
main label,
main .form-label,
main .form-check-label,
main .nav-item .nav-link,
main .nav-link span,
main .nav-link small,
main .tab-content,
main .tab-content * {
  color: #eef3fb;
}

main .text-dark,
main .link-dark,
main .nav-link.text-dark {
  color: #eef3fb !important;
}

.board-shell {
  padding: 16px;
  background: linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));
  box-shadow: 0 18px 36px rgba(0, 0, 0, 0.24);
}

.board-shell::before {
  background: linear-gradient(180deg, rgba(255, 59, 50, 0.03), transparent 28%);
}

.category-section {
  gap: 10px;
}

.challenge-grid {
  gap: 12px;
}

.operation-card {
  min-height: 146px;
  padding: 16px;
  border-color: rgba(255,255,255,0.06);
  background: linear-gradient(180deg, rgba(255,255,255,0.025), rgba(255,255,255,0.012));
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.18);
}

.operation-card::before {
  background: linear-gradient(180deg, rgba(255, 59, 50, 0.05), transparent 30%);
}

.operation-card:hover {
  border-color: rgba(255, 59, 50, 0.22);
  box-shadow: 0 14px 30px rgba(0,0,0,0.22), 0 0 12px rgba(255, 59, 50, 0.05);
}

.challenge-solved .operation-card,
.operation-card.challenge-solved {
  border-color: rgba(134, 255, 152, 0.16);
  box-shadow: 0 14px 30px rgba(0,0,0,0.22), 0 0 10px rgba(134, 255, 152, 0.06);
}

.challenge-solved .operation-card::before,
.operation-card.challenge-solved::before {
  background: linear-gradient(180deg, rgba(134, 255, 152, 0.05), transparent 30%);
}

.operation-card__title {
  font-size: 20px;
}

.operation-card__meta {
  gap: 8px 10px;
  margin-top: 16px;
}

.operation-card__points,
.operation-card__solves,
.operation-card__status {
  border-color: rgba(255,255,255,0.06);
  background: rgba(255,255,255,0.018);
}


/* v16 visual corrections */
.board-shell,
.redline-frame.board-shell {
  background: linear-gradient(180deg, rgba(11, 14, 20, 0.94), rgba(7, 10, 15, 0.98)) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.03), 0 18px 36px rgba(0, 0, 0, 0.28) !important;
}

.operation-card {
  border-color: rgba(255,255,255,0.09) !important;
  background: linear-gradient(180deg, rgba(11, 14, 20, 0.94), rgba(7, 10, 15, 0.96)) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.025), 0 14px 28px rgba(0, 0, 0, 0.30) !important;
}

.operation-card::before {
  background: linear-gradient(180deg, rgba(255, 59, 50, 0.10), transparent 24%) !important;
}

.challenge-solved .operation-card,
.operation-card.challenge-solved {
  border-color: rgba(134,255,152,0.24) !important;
  background: linear-gradient(180deg, rgba(10, 22, 14, 0.95), rgba(6, 15, 10, 0.97)) !important;
  box-shadow: inset 0 0 0 1px rgba(134,255,152,0.03), 0 14px 28px rgba(0,0,0,0.26) !important;
}

.challenge-solved .operation-card::before,
.operation-card.challenge-solved::before {
  background: linear-gradient(180deg, rgba(134,255,152,0.12), transparent 24%) !important;
}

.operation-card__icon,
.operation-card__points,
.operation-card__solves,
.operation-card__status {
  border-color: rgba(255,255,255,0.10) !important;
  background: rgba(255,255,255,0.035) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.03) !important;
}

.challenge-solved .operation-card__icon,
.challenge-solved .operation-card__points,
.challenge-solved .operation-card__solves,
.challenge-solved .operation-card__status,
.operation-card.challenge-solved .operation-card__icon,
.operation-card.challenge-solved .operation-card__points,
.operation-card.challenge-solved .operation-card__solves,
.operation-card.challenge-solved .operation-card__status {
  background: rgba(134,255,152,0.05) !important;
  border-color: rgba(134,255,152,0.16) !important;
}

.operation-card__status {
  color: var(--red-soft) !important;
}

.challenge-solved .operation-card__status,
.operation-card.challenge-solved .operation-card__status {
  color: var(--green) !important;
}

body[data-page="notifications"] .list-group-item,
body[data-page="notifications"] .notification,
body[data-page="notifications"] .card,
body[data-page="notifications"] .alert,
body[data-page="notifications"] .redline-frame {
  position: relative !important;
  color: #eef3fb !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  background: linear-gradient(180deg, rgba(11, 14, 20, 0.94), rgba(7, 10, 15, 0.96)) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.02), 0 14px 28px rgba(0,0,0,0.24) !important;
  clip-path: var(--clip-wide) !important;
  overflow: hidden !important;
}

body[data-page="notifications"] .list-group-item::before,
body[data-page="notifications"] .notification::before,
body[data-page="notifications"] .card::before,
body[data-page="notifications"] .alert::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(255,59,50,0.08), transparent 24%);
}

body[data-page="notifications"] .list-group-item > *,
body[data-page="notifications"] .notification > *,
body[data-page="notifications"] .card > *,
body[data-page="notifications"] .alert > * {
  position: relative;
  z-index: 1;
}

body[data-page="notifications"] .list-group-item .card,
body[data-page="notifications"] .card .card,
body[data-page="notifications"] .list-group-item .list-group-item,
body[data-page="notifications"] .card .list-group-item {
  background: rgba(4, 7, 11, 0.88) !important;
}


/* v17 card corner corrections */
:root {
  --clip-card-top-left: polygon(16px 0, 100% 0, 100% 100%, 0 100%, 0 16px);
}

.operation-card {
  clip-path: var(--clip-card-top-left) !important;
}

.operation-card::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(255,255,255,0.012), rgba(255,255,255,0));
  clip-path: var(--clip-card-top-left);
}

.challenge-solved .operation-card::after,
.operation-card.challenge-solved::after {
  background: linear-gradient(180deg, rgba(134,255,152,0.02), rgba(255,255,255,0));
}

.notification-stack {
  display: grid;
  gap: 16px;
}

.notification-card {
  --notification-accent: rgba(255, 59, 50, 0.72);
  position: relative;
  padding: 18px 20px 20px;
  border: 1px solid rgba(255,255,255,0.08);
  background: linear-gradient(180deg, rgba(11, 14, 20, 0.94), rgba(7, 10, 15, 0.96));
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.02), 0 14px 28px rgba(0,0,0,0.24);
  clip-path: var(--clip-card-right);
  overflow: hidden;
}

.notification-card::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(255,59,50,0.08), transparent 22%);
}

.notification-card::after {
  content: none;
}

.notification-card--alert {
  --notification-accent: rgba(255, 59, 50, 0.78);
}

.notification-card--toast {
  --notification-accent: rgba(255, 170, 72, 0.78);
}

.notification-card--background {
  --notification-accent: rgba(90, 156, 255, 0.74);
}

.notification-card--default {
  --notification-accent: rgba(255, 255, 255, 0.34);
}

.notification-card__head,
.notification-card__body {
  position: relative;
  z-index: 1;
}

.notification-card__head {
  display: grid;
  gap: 12px;
}

.notification-card__meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

.notification-card__chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 34px;
  padding: 0 12px;
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(255,255,255,0.04);
  clip-path: var(--clip);
  color: #eef3fb;
  font-family: var(--font-display);
  font-size: 11px;
  letter-spacing: 0.10em;
  text-transform: uppercase;
}

.notification-card--alert .notification-card__chip {
  border-color: rgba(255, 59, 50, 0.24);
  background: rgba(255, 59, 50, 0.10);
}

.notification-card--toast .notification-card__chip {
  border-color: rgba(255, 170, 72, 0.24);
  background: rgba(255, 170, 72, 0.10);
}

.notification-card--background .notification-card__chip {
  border-color: rgba(90, 156, 255, 0.24);
  background: rgba(90, 156, 255, 0.10);
}

.notification-card__title {
  margin: 0;
  color: #f5f8fc;
  font-family: var(--font-display);
  font-size: clamp(22px, 2.5vw, 30px);
  font-weight: 600;
  line-height: 1.08;
  letter-spacing: 0.04em;
  text-transform: none;
}

.notification-card__body {
  padding-top: 16px;
  border-top: 1px solid rgba(255,255,255,0.08);
}

.notification-card__content,
.notification-card__content * {
  color: #eef3fb !important;
}

.notification-card__content {
  font-size: 15px;
  line-height: 1.72;
}

.notification-card__content > :first-child {
  margin-top: 0;
}

.notification-card__content > :last-child {
  margin-bottom: 0;
}

.notification-card__content a {
  color: #fff !important;
  text-decoration: underline;
  text-decoration-color: rgba(255, 59, 50, 0.52);
}

.notification-card__content pre,
.notification-card__content .codehilite,
.notification-card__content blockquote {
  margin: 14px 0 0;
}

.notification-card__content ul,
.notification-card__content ol {
  padding-left: 20px;
}

.notification-card__time {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--muted);
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.notification-card__footer {
  display: flex;
  justify-content: flex-end;
  margin-top: 16px;
}

.notification-card__time [data-time],
.notification-card__time span {
  color: inherit;
}

.notifications-empty {
  padding: 28px;
  text-align: center;
  clip-path: var(--clip-card-right) !important;
}

.notifications-empty__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 72px;
  height: 72px;
  margin: 0 auto 14px;
  border: 1px solid rgba(255, 59, 50, 0.22);
  background: rgba(255, 59, 50, 0.08);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.03), 0 0 20px rgba(255, 59, 50, 0.08);
  clip-path: var(--clip);
  color: #fff;
}

.notifications-empty__icon i {
  font-size: 26px;
}

.notifications-empty__title {
  margin: 10px 0 8px;
  color: #fff;
  font-family: var(--font-display);
  font-size: clamp(22px, 2.8vw, 30px);
  line-height: 1.08;
}

.notifications-empty p {
  max-width: 460px;
  margin: 0 auto;
  color: var(--muted);
}

@media (max-width: 767.98px) {
  .notification-card {
    padding: 16px;
  }

  .notification-card__title {
    font-size: 20px;
  }

  .notifications-empty {
    padding: 22px 18px;
  }
}

body[data-page="notifications"] .list-group-item,
body[data-page="notifications"] .notification,
body[data-page="notifications"] .card,
body[data-page="notifications"] .alert,
body[data-page="notifications"] .redline-frame {
  clip-path: none !important;
}

body[data-page="notifications"] .notifications-empty {
  clip-path: var(--clip-card-right) !important;
}

/* custom tweak: centered utility nav + challenge cards with right-side cut corners */
@media (min-width: 981px) {
  .utility-bar {
    justify-content: center;
  }

  .utility-links {
    width: 100%;
    justify-content: center;
  }
}

:root {
  --clip-card-right: polygon(16px 0, 100% 0, 100% calc(100% - 16px), calc(100% - 16px) 100%, 0 100%, 0 16px);
}

.operation-card {
  clip-path: var(--clip-card-right) !important;
}

.operation-card::after {
  clip-path: var(--clip-card-right);
}


/* v18 navbar centering + clean cut card corners */
@media (min-width: 981px) {
  .topbar-main {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 86px;
    padding: 6px 0 0;
  }

  .brand {
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    z-index: 3;
  }

  .topbar-panel {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 54px;
  }

  .primary-nav {
    justify-content: center;
    width: 100%;
    gap: 24px;
  }

  .topbar-panel--guest .primary-nav {
    box-sizing: border-box;
    padding-right: 140px;
  }

  .topbar-cta {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    z-index: 3;
    justify-content: flex-end;
  }

  .topbar-panel--guest .topbar-cta {
    gap: 14px;
  }

  .utility-bar {
    justify-content: center;
    padding-top: 2px;
    padding-bottom: 14px;
  }

  .utility-links {
    width: 100%;
    justify-content: center;
    gap: 8px 18px;
  }
}

.brand-copy {
  gap: 0;
}

.brand-copy span {
  display: none;
}

.challenge-button {
  position: relative;
  background: transparent !important;
}

.operation-card,
.operation-card::after,
.operation-card::before {
  clip-path: var(--clip-card-right) !important;
}

/* v23 final card clipping + remove outer square corners */
:root {
  --clip-card-final: polygon(16px 0, 100% 0, 100% calc(100% - 16px), calc(100% - 16px) 100%, 0 100%, 0 16px);
}

.challenge-grid .challenge-button {
  clip-path: var(--clip-card-final) !important;
  overflow: hidden;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.challenge-grid .challenge-button,
.challenge-grid .challenge-button .operation-card,
.challenge-grid .challenge-button .operation-card::before,
.challenge-grid .challenge-button .operation-card::after {
  clip-path: var(--clip-card-final) !important;
}

/* challenges cleanup */
.challenge-board-shell {
  display: grid;
  gap: 18px;
}

.challenge-filter-toolbar {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  padding: 14px 16px;
  border: 1px solid rgba(255,255,255,0.08);
  background:
    linear-gradient(180deg, rgba(255,255,255,0.035), rgba(255,255,255,0.01)),
    rgba(8, 11, 18, 0.9);
  clip-path: var(--clip);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.02);
}

.challenge-filter-toolbar__main {
  flex: 1 1 auto;
  min-width: 0;
}

.challenge-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.challenge-filters--primary {
  gap: 10px;
}

.challenge-filter {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 38px;
  padding: 0 14px;
  border: 1px solid rgba(255,255,255,0.08);
  background: rgba(255,255,255,0.025);
  clip-path: var(--clip);
  color: #edf2fa;
  font-family: var(--font-display);
  font-size: 11px;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  transition: transform .16s ease, border-color .16s ease, background .16s ease, box-shadow .16s ease, color .16s ease;
}

.challenge-filter:hover,
.challenge-filter:focus-visible {
  border-color: rgba(255, 59, 50, 0.24);
  background: rgba(255, 59, 50, 0.08);
  color: #fff;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.03), 0 0 16px rgba(255, 59, 50, 0.08);
  transform: translateY(-1px);
}

.challenge-filter.is-active {
  border-color: rgba(255, 59, 50, 0.34);
  background: linear-gradient(180deg, rgba(255, 59, 50, 0.18), rgba(255, 59, 50, 0.05));
  color: #fff;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.04), 0 0 18px rgba(255, 59, 50, 0.10);
}

.challenge-filter__count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 22px;
  height: 22px;
  padding: 0 6px;
  border: 1px solid rgba(255,255,255,0.08);
  background: rgba(255,255,255,0.04);
  clip-path: var(--clip);
  color: #fff;
  font-size: 10px;
  letter-spacing: 0.04em;
}

.challenge-filter.is-active .challenge-filter__count {
  border-color: rgba(255,255,255,0.12);
  background: rgba(255,255,255,0.08);
}

.challenge-filter-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 42px;
  padding: 0 14px;
  border: 1px solid rgba(255,255,255,0.08);
  background: rgba(255,255,255,0.03);
  clip-path: var(--clip);
  color: #edf2fa;
  font-family: var(--font-display);
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  transition: transform .16s ease, border-color .16s ease, background .16s ease, box-shadow .16s ease, color .16s ease;
}

.challenge-filter-toggle:hover,
.challenge-filter-toggle:focus-visible {
  border-color: rgba(255, 59, 50, 0.24);
  background: rgba(255, 59, 50, 0.08);
  color: #fff;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.03), 0 0 16px rgba(255, 59, 50, 0.08);
}

.challenge-filter-toggle.is-active {
  border-color: rgba(255, 59, 50, 0.34);
  background: linear-gradient(180deg, rgba(255, 59, 50, 0.18), rgba(255, 59, 50, 0.05));
  color: #fff;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.04), 0 0 18px rgba(255, 59, 50, 0.10);
}

.challenge-filter-toggle__icon,
.challenge-filter-toggle__chevron {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: rgba(255,255,255,0.72);
}

.challenge-filter-toggle__label {
  white-space: nowrap;
}

.challenge-filter-toggle__chevron {
  font-size: 10px;
  transition: transform .16s ease, color .16s ease;
}

.challenge-filter-toggle__chevron.is-open {
  transform: rotate(180deg);
  color: #fff;
}

.challenge-filter-drawer {
  padding: 16px;
  border: 1px solid rgba(255,255,255,0.08);
  background:
    linear-gradient(180deg, rgba(255,255,255,0.025), rgba(255,255,255,0.01)),
    rgba(8, 11, 18, 0.88);
  clip-path: var(--clip);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.02);
}

.challenge-filter-drawer__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 14px;
}

.challenge-filter-panel {
  display: grid;
  gap: 12px;
  min-width: 0;
  padding: 14px;
  border: 1px solid rgba(255,255,255,0.06);
  background: rgba(255,255,255,0.02);
  clip-path: var(--clip);
}

.challenge-filter-panel__label {
  color: rgba(255,255,255,0.6);
  font-family: var(--font-display);
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.challenge-filters--difficulty {
  margin-top: 0;
}

.challenge-filters--status {
  margin-top: 0;
}

.challenge-filters--event {
  margin-top: 0;
}

.category-section {
  gap: 14px;
}

.category-header {
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding-bottom: 10px;
  border-bottom-color: rgba(255,255,255,0.08);
}

.category-header__main {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.category-header h2 {
  font-size: 17px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.category-header__meta {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  flex-shrink: 0;
}

.category-total {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 0 10px;
  border: 1px solid rgba(255,255,255,0.08);
  background: rgba(255,255,255,0.025);
  clip-path: var(--clip);
  color: var(--muted);
  font-size: 11px;
  letter-spacing: 0.10em;
  text-transform: uppercase;
}

.operation-card {
  display: flex;
  flex-direction: column;
  min-height: 152px;
  padding: 17px;
}

.operation-card__head {
  align-items: center;
}

.operation-card__type {
  letter-spacing: 0.10em;
  text-transform: uppercase;
}

.operation-card__title {
  margin-top: 12px;
  font-size: clamp(18px, 2vw, 21px);
  line-height: 1.12;
}

.operation-card__meta {
  align-items: center;
  gap: 8px 10px;
  margin-top: auto;
  padding-top: 16px;
  border-top: 1px solid rgba(255,255,255,0.07);
}

.operation-card__points,
.operation-card__solves {
  gap: 7px;
}

.operation-card__points > span:first-child,
.operation-card__solves > span:first-child {
  color: #fff;
  font-weight: 700;
}

.operation-card__points > span:last-child,
.operation-card__solves > span:last-child {
  color: var(--muted);
}

.operation-card__status {
  justify-content: center;
  min-width: 92px;
  margin-left: auto;
  padding: 0 10px;
  text-align: center;
  border-color: rgba(255,255,255,0.10) !important;
  background: rgba(255,255,255,0.035) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.03) !important;
}

.operation-card__difficulty {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 28px;
  padding: 0 10px;
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(255,255,255,0.035);
  clip-path: var(--clip);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.03);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: none;
}

.operation-card__difficulty.is-easy {
  color: #9ff5ab;
  border-color: rgba(134,255,152,0.22);
  background: rgba(134,255,152,0.07);
}

.operation-card__difficulty.is-medium {
  color: #ffd98b;
  border-color: rgba(244,187,113,0.24);
  background: rgba(244,187,113,0.08);
}

.operation-card__difficulty.is-hard {
  color: #ff8b6b;
  border-color: rgba(255,119,72,0.24);
  background: rgba(255,119,72,0.08);
}

.operation-card__difficulty.is-insane {
  color: #ff5f57;
  border-color: rgba(255,59,50,0.24);
  background: rgba(255,59,50,0.08);
}

.challenge-button:hover .operation-card__icon,
.challenge-button:focus-visible .operation-card__icon {
  border-color: rgba(255, 59, 50, 0.24);
  background: rgba(255, 59, 50, 0.08);
}

.challenge-grid {
  gap: 14px;
}

@media (max-width: 767.98px) {
  .challenge-filter-toolbar {
    padding: 12px;
    flex-direction: column;
  }

  .challenge-filter-toolbar__main {
    width: 100%;
  }

  .challenge-filter-toggle {
    width: 100%;
    justify-content: space-between;
  }

  .challenge-filter-drawer {
    padding: 12px;
  }

  .challenge-filter-drawer__grid {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .challenge-filter-panel {
    padding: 12px;
  }

  .challenge-filters {
    gap: 8px;
  }

  .challenge-filter {
    width: 100%;
    justify-content: space-between;
  }

  .category-header {
    align-items: flex-start;
    flex-direction: column;
  }

  .category-header__meta {
    justify-content: flex-start;
  }

  .operation-card {
    min-height: 144px;
    padding: 15px;
  }

  .operation-card__meta {
    gap: 8px;
  }

  .operation-card__status {
    width: auto;
    margin-left: 0;
    justify-content: center;
  }
}


/* v24 navbar badge + scoreboard graph */
.utility-badge:empty {
  display: none !important;
}

.scoreboard-graph {
  width: 100%;
  overflow-x: auto;
  margin: 10px 0 20px;
}

.scoreboard-graph svg {
  display: block;
  width: 100%;
  min-width: 760px;
  height: auto;
}

.scoreboard-graph__label {
  fill: #e7edf8;
  font-size: 13px;
  font-family: inherit;
}

.scoreboard-graph__track {
  fill: rgba(255,255,255,0.06);
  stroke: rgba(255,255,255,0.08);
}

.scoreboard-graph__bar {
  fill: rgba(255, 59, 50, 0.78);
}

.scoreboard-graph__value {
  fill: #ff8c85;
  font-size: 13px;
  font-family: inherit;
}


/* v25 cleanup */
.utility-link .utility-badge {
  margin-left: 2px;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.04), 0 0 18px rgba(255, 59, 50, 0.16);
}


/* v26 stability + core scoreboard */
.utility-link[data-nav="notifications"] .badge,
.utility-link[data-nav="notifications"] .badge-notification,
.utility-link[data-nav="notifications"] [data-badge],
.utility-link[data-nav="notifications"] [aria-live] {
  display: none !important;
}

.utility-link[data-nav="notifications"] .utility-badge {
  display: inline-flex !important;
}

.primary-link,
.utility-link {
  position: relative;
}

.primary-link + .primary-link,
.utility-link + .utility-link {
  padding-left: 18px;
}

.primary-link + .primary-link::before,
.utility-link + .utility-link::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 1px;
  height: 16px;
  background: rgba(255, 255, 255, 0.72);
  transform: translateY(-50%);
}

@media (max-width: 980px) {
  .primary-link + .primary-link,
  .utility-link + .utility-link {
    padding-left: 0;
  }

  .primary-link + .primary-link::before,
  .utility-link + .utility-link::before {
    display: none;
  }
}

#score-graph {
  min-height: 360px;
  margin-bottom: 20px;
  padding: 14px 18px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: linear-gradient(180deg, rgba(255, 59, 50, 0.10), rgba(0, 0, 0, 0.35)), rgba(5, 8, 15, 0.92);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.03);
}

#scoreboard .nav-pills {
  gap: 10px;
}

#scoreboard .nav-pills .nav-link {
  border-radius: 0;
  border: 1px solid rgba(255,255,255,0.12);
  background: rgba(255,255,255,0.03);
  color: #d8e1ee;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-size: 11px;
  clip-path: var(--clip);
}

#scoreboard .nav-pills .nav-link.active {
  background: linear-gradient(180deg, rgba(255, 59, 50, 0.18), rgba(255, 59, 50, 0.06));
  border-color: rgba(255, 59, 50, 0.35);
  color: #fff;
}

#scoreboard table.table {
  border: 1px solid rgba(255,255,255,0.08);
  background: rgba(5, 8, 15, 0.88);
  margin-bottom: 0;
}

#scoreboard table.table thead th {
  border-color: rgba(255,255,255,0.08);
  color: #f1f5fb;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-size: 11px;
}

#scoreboard table.table tbody td,
#scoreboard table.table tbody th {
  border-color: rgba(255,255,255,0.06);
  color: #d7dde7;
}

#scoreboard table.table tbody tr:hover td,
#scoreboard table.table tbody tr:hover th {
  background: rgba(255, 59, 50, 0.05);
}

#scoreboard table.table a {
  color: #fff;
}

#scoreboard .badge {
  border-radius: 0;
  background: rgba(255,255,255,0.10) !important;
  color: #e8edf6 !important;
  border: 1px solid rgba(255,255,255,0.12);
}


/* v27 scoreboard redesign */
body[data-page="scoreboard"] .content-shell,
body[data-page="scoreboard"] .main-section {
  padding-top: 14px;
}

.scoreboard-screen .container {
  max-width: 1160px;
}

.scoreboard-console {
  position: relative;
  padding: 22px 22px 26px;
  border: 1px solid rgba(101, 56, 44, 0.48);
  background:
    linear-gradient(180deg, rgba(83, 32, 26, 0.16), rgba(9, 10, 13, 0.94) 20%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.015), rgba(255, 255, 255, 0));
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.02),
    0 28px 60px rgba(0, 0, 0, 0.34);
  clip-path: var(--clip-wide);
  overflow: hidden;
}

.scoreboard-console::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(143, 54, 41, 0.14), transparent 24%);
}

.scoreboard-console > * {
  position: relative;
  z-index: 1;
}

.scoreboard-console__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 18px;
}

.scoreboard-console__copy {
  min-width: 0;
}

.scoreboard-console__eyebrow {
  color: #c8b5a7;
  text-transform: uppercase;
  letter-spacing: 0.22em;
  font-size: 12px;
}

.scoreboard-console__note {
  margin: 10px 0 0;
  max-width: 720px;
  color: #8e8884;
  font-size: 15px;
  line-height: 1.55;
}

.scoreboard-console__meta {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px;
}

.scoreboard-console__chip {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0 16px;
  border: 1px solid rgba(141, 90, 70, 0.44);
  background: rgba(25, 21, 22, 0.78);
  color: #f0e6db;
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  clip-path: var(--clip);
  white-space: nowrap;
}

.scoreboard-console__graph-panel {
  margin-bottom: 18px;
  padding: 12px;
  border: 1px solid rgba(122, 74, 57, 0.42);
  background: rgba(10, 11, 14, 0.88);
  clip-path: var(--clip-wide);
}

.scoreboard-console__panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
  color: #cfb5a3;
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

.scoreboard-console__panel-head small {
  color: #7e756f;
  font-size: 10px;
  letter-spacing: 0.14em;
}

.scoreboard-rankings__filters {
  margin-bottom: 12px;
}

.scoreboard-rankings__pills {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.scoreboard-rankings__pills .nav-link {
  padding: 10px 14px;
  border: 1px solid rgba(121, 76, 61, 0.36);
  background: rgba(17, 16, 20, 0.88);
  color: #b8a99e;
  clip-path: var(--clip);
  border-radius: 0;
  font-size: 10px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

.scoreboard-rankings__pills .nav-link.active {
  background: linear-gradient(180deg, rgba(138, 64, 44, 0.32), rgba(67, 28, 22, 0.28));
  border-color: rgba(208, 131, 101, 0.54);
  color: #fff3e8;
}

.scoreboard-rankings__frame {
  position: relative;
  padding: 14px;
  border: 1px solid rgba(92, 54, 43, 0.40);
  background: linear-gradient(180deg, rgba(41, 24, 22, 0.34), rgba(10, 11, 14, 0.96));
  clip-path: var(--clip-wide);
  overflow: hidden;
}

.scoreboard-rankings__frame::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(128, 52, 38, 0.12), transparent 24%);
}

.scoreboard-rankings__inner {
  position: relative;
  z-index: 1;
  padding: 10px 14px;
  border: 1px solid rgba(255, 255, 255, 0.06);
  background: rgba(11, 12, 16, 0.92);
  clip-path: var(--clip-wide);
}

.scoreboard-rankings__table {
  margin: 0;
}

.scoreboard-rankings__table thead th {
  padding: 14px 16px;
  border-color: rgba(255, 255, 255, 0.07);
  color: #efe3d9;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.20em;
  text-transform: uppercase;
}

.scoreboard-rankings__table tbody th,
.scoreboard-rankings__table tbody td {
  padding: 18px 16px;
  border-color: rgba(255, 255, 255, 0.06);
  color: #f0ece9;
  font-size: 16px;
  vertical-align: middle;
}

.scoreboard-rankings__table tbody tr:first-child th,
.scoreboard-rankings__table tbody tr:first-child td {
  background: rgba(69, 42, 31, 0.42);
}

.scoreboard-rankings__table tbody tr:hover th,
.scoreboard-rankings__table tbody tr:hover td {
  background: rgba(104, 52, 38, 0.16);
}

.scoreboard-rankings__table a {
  color: #ffffff;
}

.scoreboard-rankings__empty {
  margin-top: 10px;
  padding: 24px;
  border: 1px solid rgba(92, 54, 43, 0.40);
  background: rgba(10, 11, 14, 0.92);
  clip-path: var(--clip-wide);
}

body[data-page="scoreboard"] #score-graph {
  min-height: 360px;
  margin-bottom: 0;
  padding: 12px 14px;
  border: 1px solid rgba(255, 255, 255, 0.06);
  background:
    radial-gradient(circle at top right, rgba(135, 60, 44, 0.18), transparent 32%),
    linear-gradient(180deg, rgba(43, 23, 20, 0.42), rgba(8, 10, 13, 0.96));
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.02);
}

body[data-page="scoreboard"] #score-graph canvas {
  border-radius: 0 !important;
}

@media (max-width: 980px) {
  .scoreboard-console {
    padding: 18px 16px 20px;
  }

  .scoreboard-console__header {
    flex-direction: column;
    align-items: stretch;
  }

  .scoreboard-console__meta {
    justify-content: flex-start;
  }

  .scoreboard-rankings__inner {
    overflow-x: auto;
  }

  .scoreboard-rankings__table {
    min-width: 760px;
  }
}

@media (max-width: 640px) {
  .scoreboard-console__note {
    font-size: 14px;
  }

  .scoreboard-console__chip {
    min-height: 40px;
    padding: 0 12px;
  }
}