:root {
  --cc-ink: #101010;
  --cc-paper: #fff9e9;
  --cc-card: #ffffff;
  --cc-yellow: #ffd21f;
  --cc-orange: #ff5a24;
  --cc-red: #d71920;
  --cc-blue: #177ddc;
  --cc-muted: #5c5750;
  --cc-line: #d8cfb6;
}

body:has(.cc-site) {
  margin: 0;
  background: var(--cc-paper);
}

body:has(.cc-site) #site-header,
body:has(.cc-site) #site-footer,
.site-main:has(.cc-site) > .page-header {
  display: none;
}

.site-main:has(.cc-site) {
  max-width: none;
  padding: 0;
}

.site-main:has(.cc-site) > .page-content {
  max-width: none;
  width: 100%;
  margin: 0;
  padding: 0;
}

.site-main:has(.cc-site) .cc-site {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}

.cc-site {
  min-height: 100vh;
  color: var(--cc-ink);
  background:
    repeating-linear-gradient(-8deg, rgba(16,16,16,.035) 0 1px, transparent 1px 18px),
    linear-gradient(180deg, #fffaf0 0%, #f3ead4 100%);
  font-family: Arial, Helvetica, sans-serif;
  line-height: 1.5;
}

.cc-site * {
  box-sizing: border-box;
}

.cc-wrap {
  width: min(1160px, calc(100% - 36px));
  margin: 0 auto;
}

.cc-nav {
  position: sticky;
  top: 0;
  z-index: 50;
  border-bottom: 3px solid var(--cc-ink);
  background: rgba(255, 249, 233, .96);
  backdrop-filter: blur(14px);
}

.cc-nav .cc-wrap {
  min-height: 100px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding-top: 12px;
  padding-bottom: 12px;
}

.cc-brand {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  color: var(--cc-ink);
  font-size: 24px;
  font-weight: 950;
  letter-spacing: 0;
  text-decoration: none;
  text-transform: uppercase;
}

.cc-brand img {
  display: block;
  width: clamp(240px, 24vw, 360px);
  max-height: 120px;
  object-fit: contain;
}

.cc-nav nav,
.cc-footer nav,
.cc-actions,
.cc-share,
.cc-vote-row,
.cc-share-drawer-row,
.cc-sort {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}

.cc-nav nav a,
.cc-footer nav a {
  color: inherit;
  font-size: 13px;
  font-weight: 900;
  text-decoration: none;
  text-transform: uppercase;
}

.cc-nav nav a:hover,
.cc-footer nav a:hover {
  text-decoration: underline;
  text-decoration-thickness: 2px;
}

.cc-hero {
  padding: clamp(56px, 9vw, 112px) 0 72px;
  border-bottom: 3px solid var(--cc-ink);
  background:
    linear-gradient(90deg, rgba(255,210,31,.6), transparent 42%),
    radial-gradient(circle at 88% 18%, rgba(255,90,36,.26), transparent 26rem);
}

.cc-hero--compact {
  padding-bottom: 56px;
}

.cc-hero__grid,
.cc-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, .42fr);
  gap: clamp(28px, 6vw, 72px);
  align-items: center;
}

.cc-kicker,
.cc-rule__stamp,
.cc-card-label {
  display: inline-flex;
  width: max-content;
  max-width: 100%;
  align-items: center;
  padding: 7px 12px;
  border: 3px solid var(--cc-ink);
  background: var(--cc-yellow);
  color: var(--cc-ink);
  font-size: 13px;
  font-weight: 950;
  text-transform: uppercase;
}

.cc-site h1,
.cc-site h2,
.cc-site h3 {
  margin: 0;
  letter-spacing: 0;
  line-height: .96;
  overflow-wrap: anywhere;
}

.cc-site h1 {
  max-width: 920px;
  margin-top: 18px;
  font-size: clamp(48px, 9vw, 116px);
  font-weight: 950;
  text-transform: uppercase;
}

.cc-site h2 {
  font-size: clamp(34px, 5.2vw, 66px);
  font-weight: 950;
  text-transform: uppercase;
}

.cc-site h3 {
  font-size: clamp(28px, 4vw, 52px);
  font-weight: 950;
}

.cc-subtitle,
.cc-hero p,
.cc-copy p,
.cc-section-head p,
.cc-cta p,
.cc-social p {
  max-width: 780px;
  color: #24211d;
  font-size: clamp(18px, 2.1vw, 24px);
}

.cc-small {
  color: var(--cc-muted);
  font-size: 14px !important;
  font-weight: 800;
}

.cc-btn,
.cc-form button,
.cc-comment-form button,
.cc-comment-form-toggle,
.cc-share button,
.cc-share a,
.cc-vote-row button,
.cc-drawer-toggle,
.cc-sort a {
  min-height: 46px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 3px solid var(--cc-ink);
  border-radius: 4px;
  padding: 10px 14px;
  background: var(--cc-ink);
  color: #fff;
  font: inherit;
  font-weight: 950;
  line-height: 1;
  text-decoration: none;
  text-transform: uppercase;
  box-shadow: 5px 5px 0 var(--cc-yellow);
  cursor: pointer;
}

.cc-btn:hover,
.cc-form button:hover,
.cc-comment-form button:hover,
.cc-comment-form-toggle:hover,
.cc-share button:hover,
.cc-share a:hover,
.cc-vote-row button:hover,
.cc-drawer-toggle:hover,
.cc-sort a:hover,
.cc-sort .is-active {
  transform: translate(2px, 2px);
  box-shadow: 3px 3px 0 var(--cc-orange);
}

.cc-btn--ghost,
.cc-share a,
.cc-share button,
.cc-comment-form-toggle,
.cc-drawer-toggle,
.cc-sort a {
  background: var(--cc-card);
  color: var(--cc-ink);
}

.cc-warning-card,
.cc-cta,
.cc-social,
.cc-empty {
  border: 4px solid var(--cc-ink);
  border-radius: 6px;
  background: var(--cc-card);
  padding: clamp(22px, 4vw, 40px);
  box-shadow: 14px 14px 0 var(--cc-ink);
}

.cc-warning-card {
  width: min(100%, 360px);
  justify-self: center;
  padding: clamp(18px, 2.4vw, 28px);
  overflow: hidden;
}

.cc-warning-card img {
  display: block;
  width: min(150px, 52%);
  height: auto;
  margin: 0 0 18px;
  border: 3px solid var(--cc-ink);
  border-radius: 999px;
  background: var(--cc-yellow);
}

.cc-warning-card span {
  display: block;
  margin-bottom: 12px;
  color: var(--cc-red);
  font-weight: 950;
  text-transform: uppercase;
}

.cc-warning-card strong {
  display: block;
  max-width: 100%;
  font-size: clamp(28px, 2.6vw, 38px);
  line-height: 1;
  text-transform: uppercase;
  overflow-wrap: anywhere;
  hyphens: auto;
}

.cc-warning-card p {
  margin-bottom: 0;
  font-size: clamp(16px, 1.5vw, 19px);
  line-height: 1.38;
}

.cc-section {
  padding: clamp(56px, 8vw, 86px) 0;
  border-bottom: 2px solid var(--cc-line);
}

.cc-section--dark {
  border-color: #333;
  background: #101010;
  color: #fff;
}

.cc-section--dark .cc-section-head p,
.cc-section--dark .cc-excerpt,
.cc-section--dark .cc-meta,
.cc-section--dark .cc-comment-list p {
  color: #e5dcc5;
}

.cc-section-head {
  display: grid;
  grid-template-columns: minmax(0, .85fr) minmax(260px, 1fr);
  gap: 24px;
  align-items: end;
  margin-bottom: 32px;
}

.cc-section-head--stack {
  display: block;
}

.cc-copy {
  max-width: 940px;
}

.cc-copy p {
  margin: 18px 0 0;
}

.cc-ad-slot {
  padding: 26px 0;
  border-bottom: 2px dashed var(--cc-ink);
  background: repeating-linear-gradient(45deg, var(--cc-yellow) 0 14px, #f6b90c 14px 28px);
}

.cc-ad-slot .cc-wrap {
  min-height: 96px;
  display: grid;
  place-items: center;
  border: 3px solid var(--cc-ink);
  background: rgba(255, 255, 255, .92);
  text-align: center;
}

.cc-ad-slot p {
  margin: 0;
  font-size: 22px;
  font-weight: 950;
  text-transform: uppercase;
}

.cc-ad-slot small {
  font-weight: 900;
}

.cc-rules {
  display: grid;
  gap: 34px;
}

.cc-rule {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(220px, .32fr);
  gap: 24px;
  align-items: stretch;
  border: 4px solid var(--cc-ink);
  border-radius: 6px;
  background: var(--cc-card);
  padding: clamp(18px, 4vw, 34px);
  box-shadow: 10px 10px 0 var(--cc-yellow);
  scroll-margin-top: 100px;
}

.cc-rule__content {
  display: grid;
  gap: 18px;
}

.cc-rule__body p,
.cc-rule__body {
  color: #24211d;
  font-size: 18px;
}

.cc-rule__art {
  min-height: 250px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 18px;
  border: 3px solid var(--cc-ink);
  background:
    linear-gradient(135deg, var(--cc-yellow) 0 50%, var(--cc-ink) 50% 100%);
  text-align: center;
}

.cc-rule__art span {
  width: 96px;
  height: 96px;
  display: grid;
  place-items: center;
  border: 4px solid var(--cc-ink);
  border-radius: 999px;
  background: var(--cc-card);
  color: var(--cc-red);
  font-size: 72px;
  font-weight: 950;
  line-height: 1;
}

.cc-rule__art strong {
  max-width: 160px;
  padding: 8px;
  background: var(--cc-card);
  font-weight: 950;
  text-transform: uppercase;
}

.cc-official-warning {
  margin: 0;
  border: 3px solid #111111;
  background: #ffd200;
  padding: 14px;
  color: #111111;
  font-size: 20px;
  font-weight: 900;
}

.cc-official-warning span {
  display: block;
  margin-bottom: 4px;
  color: #111111;
  font-size: 12px;
  text-transform: uppercase;
}

.cc-form,
.cc-comment-form {
  display: grid;
  gap: 16px;
  border: 4px solid var(--cc-ink);
  border-radius: 6px;
  background: var(--cc-card);
  padding: clamp(20px, 4vw, 34px);
  box-shadow: 10px 10px 0 var(--cc-yellow);
}

.cc-form label,
.cc-comment-form label,
.cc-form fieldset {
  display: grid;
  gap: 8px;
  margin: 0;
  color: var(--cc-ink);
  font-weight: 950;
}

.cc-form span {
  color: var(--cc-muted);
  font-size: 13px;
  font-weight: 700;
}

.cc-form input,
.cc-form textarea,
.cc-form select,
.cc-comment-form input,
.cc-comment-form textarea {
  width: 100%;
  min-height: 52px;
  border: 3px solid var(--cc-ink);
  border-radius: 4px;
  padding: 10px 12px;
  background: #fff;
  color: var(--cc-ink);
  font: inherit;
}

.cc-form textarea,
.cc-comment-form textarea {
  min-height: 150px;
  resize: vertical;
}

.cc-form fieldset {
  border: 3px solid var(--cc-ink);
  padding: 14px;
}

.cc-choice {
  display: flex !important;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
  gap: 10px !important;
  font-weight: 800 !important;
}

.cc-choice input {
  width: 20px;
  min-height: 20px;
  margin-top: 2px;
}

.cc-honeypot {
  position: absolute;
  left: -9999px;
}

.cc-form-message {
  margin: 0;
  color: var(--cc-red);
  font-weight: 900;
}

.cc-form-message.is-success {
  color: #106b2f;
}

.cc-sidebar-ad .cc-ad-slot {
  padding: 0;
  border: 0;
  background: transparent;
}

.cc-sidebar-ad .cc-wrap {
  width: 100%;
  min-height: 320px;
}

.cc-sort {
  margin-bottom: 24px;
}

.cc-sort a {
  min-height: 40px;
  padding: 8px 12px;
  box-shadow: none;
}

.cc-crime-list {
  display: grid;
  gap: 22px;
}

.cc-crime-card {
  border: 3px solid #111111;
  border-radius: 6px;
  background: #ffffff;
  color: #111111;
  padding: clamp(18px, 4vw, 30px);
  box-shadow: 8px 8px 0 var(--cc-orange);
  scroll-margin-top: 130px;
  transition: background-color .18s ease, box-shadow .18s ease;
}

.cc-crime-card:target,
.cc-crime-card.is-linked-target {
  background: #fff8ce;
  box-shadow: 10px 10px 0 #ffd200;
}

.cc-crime-card h3,
.cc-section--dark .cc-crime-card h3,
.cc-crime-card strong,
.cc-section--dark .cc-crime-card strong {
  color: #111111;
}

.cc-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  margin: 12px 0;
  color: #555555;
  font-size: 14px;
  font-weight: 800;
}

.cc-excerpt {
  margin: 0 0 16px;
  color: #555555;
  font-size: 18px;
}

.cc-section--dark .cc-crime-card .cc-meta,
.cc-section--dark .cc-crime-card .cc-excerpt {
  color: #555555;
}

.cc-vote-row,
.cc-share-drawer-row {
  margin-top: 16px;
  color: #111111;
}

.cc-vote-row button {
  border-color: #111111;
  background: #ffd200;
  color: #111111;
  box-shadow: none;
}

.cc-vote-row button:nth-child(2) {
  background: #ffffff;
}

.cc-vote-row button.is-active {
  background: #111111;
  color: #ffd200;
  box-shadow: 4px 4px 0 #ffd200;
}

.cc-vote-row button:disabled {
  cursor: wait;
  opacity: .72;
}

.cc-vote-status {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 5px 10px;
  border: 2px solid #111111;
  background: #f7f7f7;
  color: #111111;
  font-size: 13px;
  font-weight: 900;
  text-transform: uppercase;
}

.cc-vote-status:empty {
  display: none;
}

.cc-crime-card .cc-share button,
.cc-crime-card .cc-share a,
.cc-crime-card .cc-drawer-toggle {
  border-color: #111111;
  background: #ffffff;
  color: #111111;
}

.cc-comments {
  margin-top: 18px;
  border: 2px solid #e0e0e0;
  border-radius: 6px;
  background: #f7f7f7;
  color: #111111;
  padding: 18px;
}

.cc-comment-list {
  display: grid;
  gap: 10px;
}

.cc-comment {
  border: 2px solid #e0e0e0;
  border-left: 6px solid #ffd200;
  border-radius: 6px;
  background: #ffffff;
  padding: 12px 14px;
  color: #111111;
}

.cc-comment strong {
  display: block;
  margin-bottom: 5px;
  color: #111111;
  font-size: 13px;
  text-transform: uppercase;
}

.cc-comment p,
.cc-section--dark .cc-comment p,
.cc-comment-list > p,
.cc-section--dark .cc-comment-list > p {
  margin: 0;
  color: #111111;
}

.cc-comment-form-toggle {
  margin-top: 14px;
  border-color: #111111;
  background: #ffd200;
  color: #111111;
  box-shadow: none;
}

.cc-comment-form-wrap[hidden] {
  display: none;
}

.cc-comment-form {
  margin-top: 14px;
  border-width: 2px;
  background: #ffffff;
  color: #111111;
  box-shadow: none;
}

.cc-comment-form label {
  color: #111111;
}

.cc-footer {
  padding: 40px 0;
  background: var(--cc-ink);
  color: #fff;
}

.cc-footer .cc-wrap {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 18px;
  align-items: center;
}

.cc-footer-brand {
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr);
  gap: 16px;
  align-items: center;
}

.cc-footer-brand img {
  width: 96px;
  height: 96px;
  object-fit: contain;
  border-radius: 8px;
}

.cc-footer strong {
  font-size: 24px;
  text-transform: uppercase;
}

.cc-footer p {
  margin: 4px 0 0;
  color: #e5dcc5;
}

@media (max-width: 900px) {
  .cc-nav .cc-wrap,
  .cc-footer .cc-wrap,
  .cc-hero__grid,
  .cc-layout,
  .cc-section-head,
  .cc-rule {
    grid-template-columns: 1fr;
  }

  .cc-nav .cc-wrap {
    display: grid;
    padding: 18px 0;
  }

  .cc-brand img {
    width: min(300px, 78vw);
    max-height: 100px;
  }

  .cc-nav nav {
    justify-content: flex-start;
  }

  .cc-warning-card,
  .cc-cta,
  .cc-social {
    box-shadow: 8px 8px 0 var(--cc-ink);
  }

  .cc-warning-card {
    width: min(100%, 520px);
    justify-self: start;
  }

  .cc-rule {
    box-shadow: 7px 7px 0 var(--cc-yellow);
  }

  .cc-rule__art {
    min-height: 180px;
  }

  .cc-share a,
  .cc-share button,
  .cc-vote-row button,
  .cc-drawer-toggle {
    flex: 1 1 auto;
  }
}

@media (max-width: 560px) {
  .cc-wrap {
    width: min(100% - 24px, 1160px);
  }

  .cc-site h1 {
    font-size: 46px;
  }

  .cc-site h2 {
    font-size: 34px;
  }

  .cc-site h3 {
    font-size: 28px;
  }

  .cc-btn,
  .cc-form button,
  .cc-comment-form button {
    width: 100%;
  }

  .cc-footer-brand {
    grid-template-columns: 72px minmax(0, 1fr);
  }

  .cc-footer-brand img {
    width: 72px;
    height: 72px;
  }
}