/* KyberTalent — adapted from https://kybertalent.sk/ (2026-10-13).
   Semantic tokens are shared by CTFd and docs/design-system.html. */
:root,
[data-bs-theme="dark"] {
  color-scheme: dark;
  --ctf-chrome: #071a2f;
  --ctf-bg: #071a2f;
  --ctf-surface: #0d2944;
  --ctf-surface-raised: #153752;
  --ctf-border: #365168;
  --ctf-text: #ffffff;
  --ctf-muted: #b7c6d2;
  --ctf-primary: #ff8c3a;
  --ctf-primary-ink: #29d3e2;
  --ctf-secondary: #29d3e2;
  --ctf-secondary-ink: #29d3e2;
  --ctf-success: #76f3be;
  --ctf-success-ink: #76f3be;
  --ctf-challenge-aura: rgba(41, 211, 226, .32);
  --ctf-solved-aura: rgba(118, 243, 190, .25);
  --ctf-solved-surface: var(--ctf-surface);
  --ctf-danger: #ff9aa6;
  --ctf-warning: #f4c66c;
  --ctf-grid: rgba(200, 200, 200, .045);
  --ctf-font-sans: "Inter", "Segoe UI", system-ui, -apple-system, sans-serif;
  --ctf-font-mono: "IBM Plex Mono", "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  --ctf-radius: 12px;
  --ctf-space-1: .25rem;
  --ctf-space-2: .5rem;
  --ctf-space-3: .75rem;
  --ctf-space-4: 1rem;
  --ctf-space-6: 1.5rem;
  --ctf-space-8: 2rem;
  --ctf-space-12: 3rem;
  --ctf-space-16: 4rem;
  --ctf-motion: 140ms;
  --bs-primary: var(--ctf-primary);
  --bs-primary-rgb: 255, 140, 58;
  --bs-secondary: var(--ctf-secondary);
  --bs-secondary-rgb: 41, 211, 226;
  --bs-success: var(--ctf-success);
  --bs-success-rgb: 118, 243, 190;
  --bs-body-bg: var(--ctf-bg);
  --bs-body-bg-rgb: 7, 26, 47;
  --bs-body-color: var(--ctf-text);
  --bs-body-color-rgb: 255, 255, 255;
  --bs-secondary-color: var(--ctf-muted);
  --bs-secondary-bg: var(--ctf-surface);
  --bs-tertiary-bg: var(--ctf-surface-raised);
  --bs-emphasis-color: var(--ctf-text);
  --bs-emphasis-color-rgb: 255, 255, 255;
  --bs-border-color: var(--ctf-border);
  --bs-link-color: var(--ctf-primary-ink);
  --bs-link-color-rgb: 41, 211, 226;
  --bs-link-hover-color: var(--ctf-text);
  --bs-code-color: var(--ctf-primary-ink);
  --bs-border-radius: var(--ctf-radius);
  --bs-border-radius-sm: var(--ctf-radius);
  --bs-border-radius-lg: var(--ctf-radius);
  --bs-border-radius-xl: var(--ctf-radius);
  --bs-border-radius-xxl: var(--ctf-radius);
  --bs-font-sans-serif: var(--ctf-font-sans);
  --bs-font-monospace: var(--ctf-font-mono);
}

/* Explicit light preference retains navy navigation and the same accent roles. */
[data-bs-theme="light"] {
  color-scheme: light;
  --ctf-bg: #f7f9fb;
  --ctf-surface: #ffffff;
  --ctf-surface-raised: #eef3f7;
  --ctf-border: #dce4eb;
  --ctf-text: #071a2f;
  --ctf-muted: #667688;
  --ctf-primary-ink: #245fc4;
  --ctf-secondary-ink: #245fc4;
  --ctf-success-ink: #17613f;
  --ctf-challenge-aura: rgba(41, 211, 226, .65);
  --ctf-solved-aura: rgba(23, 97, 63, .30);
  --ctf-solved-surface: #edf9f3;
  --ctf-danger: #b42843;
  --ctf-warning: #856000;
  --ctf-grid: rgba(90, 90, 90, .04);
  --bs-body-bg-rgb: 247, 249, 251;
  --bs-body-color-rgb: 7, 26, 47;
  --bs-emphasis-color-rgb: 7, 26, 47;
  --bs-link-color-rgb: 36, 95, 196;
}

body {
  min-height: 100vh;
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
  background-color: var(--ctf-bg);
  background-image: linear-gradient(var(--ctf-grid) 1px, transparent 1px),
    linear-gradient(90deg, var(--ctf-grid) 1px, transparent 1px);
  background-size: 48px 48px;
  color: var(--ctf-text);
  font-family: var(--ctf-font-sans);
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}
::selection { background: #ff8c3a; color: #ffffff; }
a { color: var(--ctf-primary-ink); text-underline-offset: .2em; }
a:hover { color: var(--ctf-text); }
:where(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 2px solid var(--ctf-primary-ink);
  outline-offset: 4px;
}
.btn:focus-visible, .nav-link:focus-visible, .form-control:focus-visible,
.form-select:focus-visible, .form-check-input:focus-visible {
  outline: 2px solid var(--ctf-primary-ink);
  outline-offset: 4px;
}
main[role="main"] { flex: 1 0 auto; margin-bottom: 0; }
h1, h2, h3, h4 { color: inherit; font-weight: 700; line-height: 1.2; letter-spacing: -.035em; }
p { line-height: 1.7; }
code, kbd, pre, samp, .ctf-mono { font-family: var(--ctf-font-mono); }
code { color: var(--ctf-primary-ink); }
pre, .challenge-connection-info {
  background: var(--ctf-surface);
  border: 1px solid var(--ctf-border);
  border-left: 2px solid var(--ctf-secondary-ink);
  border-radius: var(--ctf-radius);
  color: var(--ctf-text);
  padding: 1rem;
  overflow-x: auto;
}
pre code { color: inherit; }
.ctf-eyebrow, .ctf-section-id {
  font-family: var(--ctf-font-mono);
  font-size: .7rem;
  font-weight: 600;
  line-height: 1.6;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--ctf-muted);
}
.ctf-section-id { color: var(--ctf-secondary-ink); }
.ctf-divider { border: 0; border-top: 1px solid var(--ctf-border); opacity: 1; }

/* Navigation remains charcoal in either mode. */
.navbar.bg-dark {
  background: var(--ctf-chrome) !important;
  border-bottom: 1px solid #365168;
  box-shadow: none;
}
.navbar .navbar-brand {
  color: #ffffff;
  font-family: var(--ctf-font-mono);
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: -.03em;
}
.navbar .navbar-brand { display: inline-flex; align-items: center; gap: .7rem; }
.navbar .navbar-brand::before { content: none; }
.ctf-navbar-logo { display: block; width: 145px; height: auto; }
.navbar .nav-link:hover, .navbar .nav-link:focus, .navbar .nav-link.active { color: #29d3e2; }
.ctf-brand-year { color: #b7c6d2; font-size: .85rem; }
.ctf-brand-logo { display: block; width: clamp(180px, 42vw, 300px); height: auto; max-width: 100%; }
.ctf-logo-light { display: none; }
[data-bs-theme="light"] .ctf-logo-dark { display: none; }
[data-bs-theme="light"] .ctf-logo-light { display: block; }
@media (max-width: 575.98px) { .navbar .navbar-brand { font-size: .82rem; gap: .5rem; } .ctf-navbar-logo { width: 125px; } }
.navbar .nav-link { font-size: .82rem; color: #b7c6d2; }
.navbar .nav-link:hover, .navbar .nav-link:focus, .navbar .nav-link.active { color: #29d3e2; }
.navbar .ctf_logo { max-height: 34px; width: auto; }
.navbar-toggler { border-radius: var(--ctf-radius); }

/* Crisp controls; glow belongs to the primary action only. */
.btn {
  border-radius: var(--ctf-radius);
  font-family: var(--ctf-font-mono);
  font-size: .8rem;
  font-weight: 600;
  letter-spacing: .01em;
  padding: .7rem 1.05rem;
  min-height: 44px;
  transition: color var(--ctf-motion), background-color var(--ctf-motion), border-color var(--ctf-motion), box-shadow var(--ctf-motion);
}
.btn-primary, #challenge-submit {
  --bs-btn-color: #071a2f;
  --bs-btn-bg: var(--ctf-primary);
  --bs-btn-border-color: var(--ctf-primary);
  --bs-btn-hover-color: #071a2f;
  --bs-btn-hover-bg: #ff9f5b;
  --bs-btn-hover-border-color: #ff9f5b;
  --bs-btn-active-color: #071a2f;
  --bs-btn-active-bg: #ffae74;
  --bs-btn-active-border-color: #ffae74;
  --bs-btn-disabled-color: #071a2f;
  --bs-btn-disabled-bg: var(--ctf-primary);
  --bs-btn-disabled-border-color: var(--ctf-primary);
  --bs-btn-focus-shadow-rgb: 255, 140, 58;
}
.btn-primary:hover, #challenge-submit:hover { box-shadow: 0 0 18px rgba(255, 140, 58, .16); }
.btn-outline-primary, .btn-outline-light, .btn-info {
  --bs-btn-color: var(--ctf-primary-ink);
  --bs-btn-border-color: var(--ctf-border);
  --bs-btn-hover-color: var(--ctf-primary-ink);
  --bs-btn-hover-bg: var(--ctf-surface-raised);
  --bs-btn-hover-border-color: var(--ctf-primary-ink);
  --bs-btn-active-color: var(--ctf-text);
  --bs-btn-active-bg: var(--ctf-surface-raised);
  --bs-btn-active-border-color: var(--ctf-primary-ink);
  --bs-btn-disabled-color: var(--ctf-muted);
  --bs-btn-disabled-bg: transparent;
  --bs-btn-disabled-border-color: var(--ctf-border);
}
/* Handouts need a light fill behind their blue-ink label. */
[data-bs-theme="light"] .challenge-files .btn-file {
  --bs-btn-bg: #eaf4ff;
}
.btn-secondary, .btn-outline-secondary {
  --bs-btn-color: var(--ctf-secondary-ink);
  --bs-btn-bg: var(--ctf-surface);
  --bs-btn-border-color: var(--ctf-secondary-ink);
  --bs-btn-hover-color: var(--ctf-text);
  --bs-btn-hover-bg: var(--ctf-surface-raised);
  --bs-btn-hover-border-color: var(--ctf-secondary-ink);
  --bs-btn-active-color: var(--ctf-text);
  --bs-btn-active-bg: var(--ctf-surface-raised);
  --bs-btn-active-border-color: var(--ctf-secondary-ink);
  --bs-btn-disabled-color: var(--ctf-muted);
  --bs-btn-disabled-bg: var(--ctf-surface);
  --bs-btn-disabled-border-color: var(--ctf-border);
}
.btn-dark {
  --bs-btn-color: var(--ctf-text);
  --bs-btn-bg: var(--ctf-surface);
  --bs-btn-border-color: var(--ctf-border);
  --bs-btn-hover-color: var(--ctf-text);
  --bs-btn-hover-bg: var(--ctf-surface-raised);
  --bs-btn-hover-border-color: var(--ctf-primary-ink);
  --bs-btn-active-color: var(--ctf-text);
  --bs-btn-active-bg: var(--ctf-surface-raised);
  --bs-btn-disabled-color: var(--ctf-muted);
  --bs-btn-disabled-bg: var(--ctf-surface);
  --bs-btn-disabled-border-color: var(--ctf-border);
}
.btn-success {
  --bs-btn-color: #071a2f;
  --bs-btn-bg: var(--ctf-success);
  --bs-btn-border-color: var(--ctf-success);
  --bs-btn-hover-color: #071a2f;
  --bs-btn-hover-bg: #a0f7d2;
  --bs-btn-hover-border-color: #a0f7d2;
  --bs-btn-active-color: #071a2f;
  --bs-btn-active-bg: var(--ctf-success);
}
.btn:disabled, .btn.disabled { opacity: .45; box-shadow: none; cursor: not-allowed; }

.form-control, .form-select, .input-group-text {
  background-color: var(--ctf-surface);
  color: var(--ctf-text);
  border: 1px solid var(--ctf-border);
  border-radius: var(--ctf-radius);
  min-height: 44px;
}
.form-control::placeholder { color: var(--ctf-muted); opacity: 1; }
.form-control:focus, .form-select:focus {
  background-color: var(--ctf-surface);
  color: var(--ctf-text);
  border-color: var(--ctf-primary-ink);
  box-shadow: none;
}
.form-label { font-size: .85rem; font-weight: 600; }
.form-text, .text-muted, .text-body-secondary { color: var(--ctf-muted) !important; }
.form-check-input:checked { background-color: var(--ctf-primary-ink); border-color: var(--ctf-primary-ink); }

.card, .modal-content, .list-group-item, .dropdown-menu {
  background-color: var(--ctf-surface);
  color: var(--ctf-text);
  border: 1px solid var(--ctf-border);
  border-radius: var(--ctf-radius);
  box-shadow: none;
}
.modal-header, .modal-footer { border-color: var(--ctf-border); }
.dropdown-item { color: var(--ctf-text); }
.dropdown-item:hover, .dropdown-item:focus { background: var(--ctf-surface-raised); color: var(--ctf-primary-ink); }
.dropdown-item.bg-primary { color: #071a2f !important; }

/* Include :root to override core's mode-specific card rules. */
:root button.challenge-button {
  padding: 1.25rem;
  text-align: left;
  background: var(--ctf-surface);
  color: var(--ctf-text);
  border: 1px solid var(--ctf-border);
  border-radius: var(--ctf-radius);
  box-shadow: 0 0 15px var(--ctf-challenge-aura);
  min-height: 190px;
}
:root button.challenge-button:hover { border-color: var(--ctf-primary-ink); background: var(--ctf-surface-raised); }
.challenge-inner { display: flex; flex-direction: column; gap: .85rem; height: 100%; }
.challenge-inner > p, .challenge-name { font-family: var(--ctf-font-sans); font-size: 1rem; font-weight: 650; line-height: 1.45; margin: 0; letter-spacing: -.02em; }
.ctf-challenge-meta { display: flex; align-items: center; justify-content: space-between; gap: .75rem; }
.ctf-challenge-points { color: var(--ctf-primary-ink); font-family: var(--ctf-font-mono); font-size: 1.75rem; font-weight: 600; line-height: 1.2; font-variant-numeric: tabular-nums; }
.ctf-challenge-unit { color: var(--ctf-muted); font-family: var(--ctf-font-mono); font-size: .7rem; }
.ctf-challenge-status { color: var(--ctf-muted); font-family: var(--ctf-font-mono); font-size: .68rem; display: inline-flex; align-items: center; gap: .35rem; }
:root button.challenge-button.challenge-solved {
  background-color: var(--ctf-solved-surface);
  color: var(--ctf-text);
  border-color: var(--ctf-success-ink);
  border-left-width: 3px;
  box-shadow: 0 0 15px var(--ctf-solved-aura);
}
:root button.challenge-button.challenge-solved:hover {
  background-color: var(--ctf-solved-surface);
  border-color: var(--ctf-success-ink);
}
.challenge-solved .ctf-challenge-status, .challenge-solved .ctf-challenge-points { color: var(--ctf-success-ink); }
.challenge-tags { display: flex; flex-wrap: wrap; gap: .35rem; margin-top: auto; justify-content: flex-start; }
.challenge-tag, .ctf-chip {
  background: transparent;
  border: 1px solid var(--ctf-border);
  border-radius: var(--ctf-radius);
  padding: .18rem .45rem;
  font-family: var(--ctf-font-mono);
  font-size: .65rem;
  font-weight: 500;
  line-height: 1.5;
  color: var(--ctf-muted);
}
.challenge-tag.badge.bg-info { background-color: transparent !important; color: var(--ctf-muted); }
.category-header { display: flex; align-items: center; gap: 1rem; }
.category-header h3 { font-family: var(--ctf-font-mono); font-size: 1rem; letter-spacing: -.02em; margin: 0; }
.category-header::after { content: ""; flex: 1; height: 1px; background: var(--ctf-border); }

.table {
  --bs-table-color: var(--ctf-text);
  --bs-table-bg: var(--ctf-surface);
  --bs-table-border-color: var(--ctf-border);
  --bs-table-striped-color: var(--ctf-text);
  --bs-table-striped-bg: var(--ctf-surface-raised);
  --bs-table-hover-color: var(--ctf-text);
  --bs-table-hover-bg: var(--ctf-surface-raised);
  font-variant-numeric: tabular-nums;
}
.table > thead th { background: var(--ctf-surface-raised); color: var(--ctf-muted); border-bottom: 1px solid var(--ctf-primary-ink); font-family: var(--ctf-font-mono); font-size: .7rem; font-weight: 500; letter-spacing: .06em; text-transform: uppercase; }
.table td, .table th { padding: .9rem 1rem; }
.nav-tabs { border-color: var(--ctf-border); }
.nav-tabs .nav-link { color: var(--ctf-muted); border-radius: var(--ctf-radius); }
.nav-tabs .nav-link.active { color: var(--ctf-primary-ink); background: var(--ctf-surface); border-color: var(--ctf-border); border-bottom-color: var(--ctf-primary-ink); }
.progress { background: var(--ctf-surface-raised); border-radius: var(--ctf-radius); }
.progress-bar { background: var(--ctf-primary); }
.bg-primary { background-color: var(--ctf-primary) !important; color: #071a2f; }
.bg-secondary { background-color: var(--ctf-secondary) !important; color: #071a2f; }
.bg-success { background-color: var(--ctf-success) !important; color: #071a2f; }
.text-primary { color: var(--ctf-primary-ink) !important; }
.text-secondary { color: var(--ctf-secondary-ink) !important; }
.text-success { color: var(--ctf-success-ink) !important; }
.text-danger { color: var(--ctf-danger) !important; }
.alert { border-radius: var(--ctf-radius); border: 1px solid var(--ctf-border); background: var(--ctf-surface); color: var(--ctf-text); }
.alert-success { border-left: 3px solid var(--ctf-success-ink); color: var(--ctf-success-ink); }
.alert-danger { border-left: 3px solid var(--ctf-danger); color: var(--ctf-danger); }
.alert-warning { border-left: 3px solid var(--ctf-warning); color: var(--ctf-warning); }
.alert-info { border-left: 3px solid var(--ctf-primary-ink); }

.jumbotron { background: var(--ctf-surface) !important; color: var(--ctf-text); border-bottom: 1px solid var(--ctf-border); padding: 3rem 0; }
.jumbotron h1 { font-size: clamp(2rem, 5vw, 3.5rem); margin: .5rem 0 0; }
.ctf-hero { position: relative; border: 1px solid var(--ctf-border); border-top: 2px solid var(--ctf-primary-ink); border-radius: var(--ctf-radius); background: var(--ctf-surface); padding: clamp(1.5rem, 5vw, 4rem); margin: 2rem 0; text-align: left; }
.ctf-hero h1 { font-size: clamp(2rem, 5vw, 4rem); max-width: 18ch; margin: 1rem 0; }
.ctf-hero-sub { max-width: 58ch; color: var(--ctf-muted); font-size: 1.05rem; }
.ctf-hero-actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 2rem; }
.ctf-hero {
  color: #fff; background-color: #071a2f;
  background-image: radial-gradient(circle at 100% 0, rgba(41,211,226,.16), transparent 55%), linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
  background-size: auto, 48px 48px, 48px 48px;
  border: 1px solid #365168; border-radius: 18px;
}
.ctf-hero .ctf-eyebrow { color: #29d3e2; }
.ctf-hero-sub { color: #d6e1ea; }
.ctf-hero .btn-secondary { --bs-btn-color: #fff; --bs-btn-bg: transparent; --bs-btn-border-color: #718497; --bs-btn-hover-color: #29d3e2; --bs-btn-hover-bg: #0d2944; --bs-btn-hover-border-color: #29d3e2; }
.btn { border-radius: 9px; font-family: var(--ctf-font-sans); font-weight: 800; }
.ctf-info-panel { border-radius: 14px; }
.ctf-info-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.ctf-info-panel { background: var(--ctf-surface); border: 1px solid var(--ctf-border); padding: 1.5rem; }
.ctf-info-panel h2 { font-size: 1.15rem; margin: .65rem 0; }
.ctf-info-panel p { color: var(--ctf-muted); margin-bottom: 0; }
.ctf-schedule, .ctf-rules { margin-top: 3rem; }
.ctf-schedule > h2, .ctf-rules > h2 { font-size: 1.5rem; margin: .5rem 0 1.5rem; }
.ctf-info-panel a { color: var(--ctf-secondary-ink); }
.ctf-organizers { margin-top: 3rem; padding-top: 2rem; border-top: 1px solid var(--ctf-border); }
.ctf-organizers h2 { font-size: 1.5rem; margin: .5rem 0 1.5rem; }
.ctf-organizer-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.ctf-organizer-logo { display: flex; align-items: center; justify-content: center; min-width: 0; height: 148px; padding: 1.25rem; background: #fff; border: 1px solid #dedede; border-radius: var(--ctf-radius); }
.ctf-organizer-logo img { display: block; width: 100%; height: 100%; object-fit: contain; }
@media (max-width: 991.98px) { .ctf-organizer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.ctf-footer { flex-shrink: 0; z-index: auto; position: static; bottom: auto; height: auto; line-height: 1.65; margin-top: 4rem; padding: 1.5rem 0; background: var(--ctf-chrome); border-top: 1px solid #365168; color: #b7c6d2; }
.ctf-footer-meta { display: flex; flex-wrap: wrap; gap: 1rem; justify-content: space-between; font-family: var(--ctf-font-mono); font-size: .7rem; }
.ctf-footer-credit { color: #b7c6d2; }
.ctf-footer-credit:hover { color: var(--ctf-primary); }

@media (max-width: 575.98px) {
  .ctf-info-grid { grid-template-columns: 1fr; }
  .ctf-organizer-grid { grid-template-columns: 1fr; }
  .ctf-hero-actions > .btn { flex: 1 1 100%; text-align: center; }
  .ctf-footer-meta { flex-direction: column; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}