@font-face {
  font-family: 'Hack';
  src: url('/theme/fonts/hack-regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Hack';
  src: url('/theme/fonts/hack-bold.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

:root {
  --background-accent: light-dark(#e7f8ec, #0e2a17);
  --background-accent-hover: light-dark(#d3f2dd, #143d21);

  --foreground-accent: light-dark(#137137, #33cc55);

  --foreground-prose-link: light-dark(#137137, #33cc55);
  --ring: light-dark(#137137, #33cc55);

  --font-sans: 'Helvetica Neue', Helvetica, Arial, 'Outfit', 'Outfit Fallback',
    sans-serif;
  --font-mono: 'Hack', Consolas, 'Geist Mono', 'Geist Mono Fallback', Monaco,
    'Lucida Console', monospace;
}

.pwny-term {
  font-family: var(--font-mono);
  font-weight: 700;
  font-size: clamp(1.35rem, 1.05rem + 1.3vw, 1.95rem);
  letter-spacing: -0.01em;
  color: var(--foreground-accent);
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 0.6ch;
  margin: 0.25rem 0 1.5rem;
}

.pwny-term::before {
  content: '>';
  opacity: 0.6;
}

.pwny-rotate {
  display: block;
  height: 1.4em;
  line-height: 1.4em;
  overflow: hidden;
}

.pwny-rotate > span {
  display: block;
  animation: pwny-cycle 16s steps(1, end) infinite;
}

@keyframes pwny-cycle {
  0% { transform: translateY(0); }
  25% { transform: translateY(-1.4em); }
  50% { transform: translateY(-2.8em); }
  75% { transform: translateY(-4.2em); }
}

.pwny-rotate > span > span {
  display: block;
  height: 1.4em;
  white-space: nowrap;
}

.pwny-word {
  display: inline-block;
  overflow: hidden;
  vertical-align: bottom;
  width: 0;
  animation: pwny-type 16s steps(var(--pwny-characters), end) var(--pwny-delay) infinite both;
}

.pwny-rotate > span > span:nth-child(1) {
  --pwny-characters: 5;
  --pwny-delay: 0s;
}

.pwny-rotate > span > span:nth-child(2) {
  --pwny-characters: 6;
  --pwny-delay: 4s;
}

.pwny-rotate > span > span:nth-child(3) {
  --pwny-characters: 15;
  --pwny-delay: 8s;
}

.pwny-rotate > span > span:nth-child(4) {
  --pwny-characters: 11;
  --pwny-delay: 12s;
}

@keyframes pwny-type {
  0% { width: 0; }
  8%, 19% { width: calc(var(--pwny-characters) * 1ch); }
  24%, 100% { width: 0; }
}

.pwny-caret {
  display: inline-block;
  width: 0.55ch;
  height: 1em;
  margin-left: 0.15ch;
  vertical-align: -0.12em;
  background: var(--foreground-accent);
  animation: pwny-blink 1.1s steps(1) infinite;
}

@keyframes pwny-blink {
  0%, 49%   { opacity: 1; }
  50%, 100% { opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .pwny-rotate > span,
  .pwny-caret {
    animation: none;
  }
  .pwny-word {
    animation: none;
    width: auto;
  }
  .pwny-caret {
    opacity: 1;
  }
}

a:has(> logo-light, > logo-dark) {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  text-decoration: none;
}

a:has(> logo-light, > logo-dark) > logo-light,
a:has(> logo-light, > logo-dark) > logo-dark {
  display: none !important;
}

a:has(> logo-light, > logo-dark)::before {
  content: '';
  flex: 0 0 auto;
  width: 2rem;
  height: 2rem;
  background-color: var(--foreground-accent);
  -webkit-mask: url('/theme/logos/sigpwny-pwny8-outline.svg') center / contain no-repeat;
  mask: url('/theme/logos/sigpwny-pwny8-outline.svg') center / contain no-repeat;
}

a:has(> logo-light, > logo-dark)::after {
  content: 'Fall CTF 2026';
  font-family: var(--font-sans);
  font-weight: 700;
  font-size: 1.15rem;
  letter-spacing: -0.01em;
  white-space: nowrap;
  color: var(--foreground-accent);
}

@media (max-width: 30rem) {
  a:has(> logo-light, > logo-dark)::after {
    display: none;
  }
}

prose-content:has(> .pwny-term) > h1 {
  text-align: center;
  font-weight: 700;
  font-size: clamp(2rem, 1.45rem + 2.2vw, 2.9rem);
  line-height: 1.05;
  letter-spacing: -0.03em;
  text-wrap: balance;
  margin-block: 0.5rem 0.5rem;
  color: var(--foreground-accent);
}

.pwny-term + p {
  text-align: center;
  text-wrap: balance;
  margin-inline: auto;
  max-width: 46ch;
}

prose-content:has(> .pwny-term) > div[data-timer] {
  text-align: center;
}

prose-content:has(> .pwny-term) > h2 {
  border-top: 1px solid var(--border);
  padding-top: 1.75rem;
  margin-block: 2.75rem 0.75rem;
}

prose-content:has(> .pwny-term) > h2:first-of-type {
  margin-block-start: 2rem;
}

prose-content:has(> .pwny-term) > h3 {
  margin-block: 1.75rem 0.5rem;
}

.pwny-facts {
  font-family: var(--font-mono);
  font-size: var(--step-0);
  line-height: 1.7;
  text-align: center;
  width: fit-content;
  margin: 1.5rem auto 2rem;
  padding: 0.85rem 2rem;
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  color: var(--foreground-l0);
}

.pwny-facts b {
  color: var(--foreground-accent);
  font-weight: 700;
}

.pwny-prizes {
  columns: 2;
  column-gap: 2.5rem;
  margin: 0 0 1em;
  padding-left: 1.25rem;
}

.pwny-prizes li {
  break-inside: avoid;
  margin: 0.15rem 0;
  color: var(--foreground-prose);
}

@media (max-width: 40rem) {
  .pwny-prizes {
    columns: 1;
  }
}

.pwny-sponsors {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 1.75rem 3rem;
  margin: 1.25rem 0 0.5rem;
}

.pwny-sponsors a {
  flex: 0 0 auto;
  display: inline-block;
  line-height: 0;
  opacity: 0.85;
  transition: opacity 120ms ease;
}

.pwny-sponsors a:hover {
  opacity: 1;
}

.pwny-sponsors img {
  height: 2.25rem;
  width: auto;
  max-width: 13rem;
  object-fit: contain;
}

@media (prefers-color-scheme: light) {
  :root:not([data-theme]) .pwny-sponsors {
    background: #000000;
    border-radius: 10px;
    padding: 1.25rem 1.75rem;
  }
}

:root[data-theme='light'] .pwny-sponsors {
  background: #000000;
  border-radius: 10px;
  padding: 1.25rem 1.75rem;
}