.csnh-tools {
  --csnh-tools-navy: var(--aff-brand-900, #0a2647);
  --csnh-tools-blue: var(--aff-brand, #2f80ed);
  --csnh-tools-gold: var(--aff-accent, #f9b233);
  --csnh-tools-ink: var(--aff-ink, #172033);
  --csnh-tools-muted: var(--aff-muted, #64748b);
  --csnh-tools-line: var(--aff-line, #dbe4ef);
  --csnh-tools-surface: #f7faff;
  color: var(--csnh-tools-ink);
}

.csnh-tools__hero {
  position: relative;
  margin: 0 0 1.5rem;
  padding: clamp(1.55rem, 4vw, 3rem);
  overflow: hidden;
  border-radius: 18px;
  background:
    radial-gradient(circle at 85% 10%, rgba(249, 178, 51, .3), transparent 26rem),
    linear-gradient(135deg, #061b34, var(--csnh-tools-navy));
  color: #fff;
}

.csnh-tools__eyebrow,
.csnh-tool-card__kicker {
  margin: 0 0 .45rem;
  color: var(--csnh-tools-gold);
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .11em;
}

.csnh-tools__hero h2 {
  max-width: 44rem;
  margin: 0;
  color: #fff;
  font-size: clamp(1.8rem, 4vw, 3rem);
  line-height: 1.08;
}

.csnh-tools__hero > p:not(.csnh-tools__eyebrow) {
  max-width: 44rem;
  margin: .95rem 0 0;
  color: #dcecff;
  font-size: clamp(1rem, 2vw, 1.14rem);
  line-height: 1.6;
}

.csnh-tools__quicknav {
  display: grid;
  max-width: 52rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .7rem;
  margin-top: 1.5rem;
}

.csnh-tools__quicknav a {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: .7rem;
  padding: .72rem .78rem;
  border: 1px solid rgba(255, 255, 255, .22);
  border-radius: 12px;
  background: rgba(255, 255, 255, .09);
  color: #fff;
  text-decoration: none;
  transition: transform .18s ease, border-color .18s ease, background .18s ease;
}

.csnh-tools__quicknav a:hover,
.csnh-tools__quicknav a:focus-visible {
  border-color: rgba(249, 178, 51, .85);
  background: rgba(255, 255, 255, .15);
  color: #fff;
  transform: translateY(-2px);
}

.csnh-tools__quicknav a > span:first-child {
  display: grid;
  width: 2rem;
  height: 2rem;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 50%;
  background: var(--csnh-tools-gold);
  color: var(--csnh-tools-navy);
  font-size: 1.05rem;
  font-weight: 900;
}

.csnh-tools__quicknav a > span:last-child { display: grid; min-width: 0; gap: .08rem; }
.csnh-tools__quicknav strong { color: #fff; font-size: .88rem; line-height: 1.25; }
.csnh-tools__quicknav small { color: #c8dcf2; font-size: .74rem; line-height: 1.3; }

.csnh-tools__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
  gap: 1.35rem;
}

.csnh-tool-card {
  position: relative;
  min-width: 0;
  padding: clamp(1.25rem, 3vw, 1.8rem);
  border: 1px solid var(--csnh-tools-line);
  border-top: 4px solid #b9d3ef;
  border-radius: 17px;
  background: #fff;
  box-shadow: 0 10px 28px rgba(10, 38, 71, .08);
  scroll-margin-top: 1.5rem;
}

.csnh-tool-card--featured {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: minmax(0, 1.18fr) minmax(20rem, .82fr);
  column-gap: clamp(1.2rem, 3vw, 2rem);
  border-top-color: var(--csnh-tools-gold);
}

.csnh-tool-card--featured > .csnh-tool-card__heading,
.csnh-tool-card--featured > .csnh-tool-card__lead,
.csnh-tool-card--featured > .csnh-wagering-share-card,
.csnh-tool-card--featured > .csnh-tool-disclaimer {
  grid-column: 1 / -1;
}

.csnh-tool-card--wagering > .csnh-wagering { grid-column: 1; }
.csnh-tool-card--wagering > .csnh-wagering-result { grid-column: 2; margin-top: 0; }
#regulation-checker { border-top-color: #64b58a; }
#licence-domain-checker { border-top-color: var(--csnh-tools-blue); }

.csnh-tool-card__heading {
  display: flex;
  align-items: center;
  gap: .8rem;
}

.csnh-tool-card__icon {
  display: grid;
  width: 2.6rem;
  height: 2.6rem;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 50%;
  background: #fff3d7;
  color: var(--csnh-tools-navy);
  font-size: 1.4rem;
  font-weight: 900;
}

.csnh-tool-card__heading h2 {
  margin: 0;
  color: var(--csnh-tools-navy);
  font-size: clamp(1.25rem, 2vw, 1.55rem);
  line-height: 1.2;
}

.csnh-tool-card__kicker { margin-bottom: .14rem; }
.csnh-tool-card__lead { margin: 1rem 0 1.25rem; color: var(--csnh-tools-muted); line-height: 1.55; }

.csnh-tool-fields {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .85rem;
}

.csnh-wagering-base {
  margin: 0 0 1rem;
  padding: 0;
  border: 0;
}

.csnh-wagering-base legend {
  margin-bottom: .55rem;
  color: var(--csnh-tools-navy);
  font-size: .88rem;
  font-weight: 800;
}

.csnh-wagering-base__choices {
  display: flex;
  flex-wrap: wrap;
  gap: .6rem;
}

.csnh-wagering-base__choices label {
  display: inline-flex;
  min-height: 42px;
  align-items: center;
  gap: .45rem;
  padding: .48rem .7rem;
  border: 1px solid var(--csnh-tools-line);
  border-radius: 999px;
  background: #fff;
  cursor: pointer;
}

.csnh-wagering-base__choices input[type="radio"] {
  width: 1.05rem;
  min-width: 1.05rem;
  min-height: 1.05rem;
  height: 1.05rem;
  margin: 0;
  padding: 0;
  accent-color: var(--csnh-tools-navy);
}

.csnh-tools label,
.csnh-tool-field label {
  display: grid;
  gap: .4rem;
  color: var(--csnh-tools-navy);
  font-size: .88rem;
  font-weight: 800;
}

.csnh-tools input,
.csnh-tools select {
  width: 100%;
  min-height: 46px;
  box-sizing: border-box;
  border: 1px solid #b8c7d9;
  border-radius: 10px;
  background: #fff;
  color: var(--csnh-tools-ink);
  font: inherit;
}

.csnh-tools input { padding: .6rem .72rem; }
.csnh-tools select { padding: .6rem .72rem; }
.csnh-tools input:focus,
.csnh-tools select:focus,
.csnh-regulation-choice:focus-visible,
.csnh-tool-button:focus-visible,
.csnh-source-link:focus-visible {
  outline: 3px solid var(--csnh-tools-gold);
  outline-offset: 3px;
}

.csnh-tool-input-suffix { position: relative; display: block; }
.csnh-tool-input-suffix input { padding-right: 2rem; }
.csnh-tool-input-suffix > span {
  position: absolute;
  top: 50%;
  right: .75rem;
  color: var(--csnh-tools-muted);
  font-weight: 800;
  transform: translateY(-50%);
}

.csnh-tool-label-note {
  color: var(--csnh-tools-muted);
  font-size: .78rem;
  font-weight: 600;
}

.csnh-tool-button {
  display: inline-flex;
  min-height: 46px;
  align-items: center;
  justify-content: center;
  margin-top: 1rem;
  padding: .68rem 1rem;
  border: 1px solid var(--csnh-tools-navy);
  border-radius: 10px;
  background: var(--csnh-tools-navy);
  color: #fff;
  cursor: pointer;
  font: inherit;
  font-weight: 800;
}

.csnh-tool-button:hover { border-color: var(--csnh-tools-blue); background: var(--csnh-tools-blue); }

.csnh-tool-button--secondary {
  margin-top: 0;
  border-color: #b8c7d9;
  background: #fff;
  color: var(--csnh-tools-navy);
}

.csnh-tool-button--secondary:hover { border-color: var(--csnh-tools-blue); background: #eef6ff; color: var(--csnh-tools-blue); }

.csnh-wagering-result {
  margin-top: 1.1rem;
  padding: 1rem;
  border-radius: 12px;
  background: var(--csnh-tools-surface);
}

.csnh-wagering-result p { margin: 0; color: var(--csnh-tools-muted); font-size: .9rem; }
.csnh-wagering-result output {
  display: block;
  margin: .25rem 0;
  color: var(--csnh-tools-navy);
  font-size: clamp(1.7rem, 4vw, 2.25rem);
  font-weight: 900;
  letter-spacing: -.03em;
}

.csnh-wagering-result__facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .72rem;
  margin: 1rem 0 0;
}

.csnh-wagering-result__facts > div {
  min-width: 0;
  padding: .72rem;
  border: 1px solid #dce8f5;
  border-radius: 10px;
  background: #fff;
}

.csnh-wagering-result__facts dt {
  color: var(--csnh-tools-muted);
  font-size: .76rem;
  font-weight: 800;
  line-height: 1.35;
}

.csnh-wagering-result__facts dd {
  margin: .25rem 0 0;
  color: var(--csnh-tools-navy);
  font-size: 1rem;
  font-weight: 850;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.csnh-wagering-result__facts output {
  display: inline;
  margin: 0;
  font-size: inherit;
  letter-spacing: normal;
}

.csnh-wagering-progress dd { display: grid; gap: .38rem; }
.csnh-wagering-progress progress {
  width: 100%;
  height: .62rem;
  accent-color: var(--csnh-tools-blue);
}

.csnh-wagering-share {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .65rem 1rem;
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid #dce8f5;
}

.csnh-wagering-share p {
  flex: 1 1 13rem;
  line-height: 1.4;
}

.csnh-wagering-share-card {
  display: grid;
  grid-template-columns: minmax(0, 31rem) minmax(14rem, 1fr);
  column-gap: clamp(1rem, 3vw, 1.7rem);
  margin-top: 1.15rem;
  padding-top: 1.15rem;
  border-top: 1px solid #dce8f5;
}

.csnh-wagering-share-card[hidden] { display: none; }

.csnh-wagering-share-card__heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: .9rem;
  grid-column: 1 / -1;
}

.csnh-wagering-share-card__heading h3 {
  margin: 0;
  color: var(--csnh-tools-navy);
  font-size: 1.1rem;
}

.csnh-wagering-share-card__size {
  flex: 0 0 auto;
  color: var(--csnh-tools-muted);
  font-size: .78rem;
  font-weight: 700;
}

.csnh-wagering-card-preview {
  display: grid;
  width: min(100%, 31rem);
  aspect-ratio: 4 / 5;
  overflow: hidden;
  border: 1px solid #dce8f5;
  border-radius: 14px;
  background: #f7faff;
  box-shadow: 0 12px 28px rgba(10, 38, 71, .13);
  grid-template-rows: 34.45% 53.7% 11.85%;
}

.csnh-wagering-card-preview__top {
  display: flex;
  min-width: 0;
  flex-direction: column;
  justify-content: space-between;
  padding: clamp(1rem, 4vw, 1.55rem);
  background:
    radial-gradient(circle at 86% 8%, rgba(249, 178, 51, .26), transparent 44%),
    linear-gradient(135deg, #061b34, #0a2647);
  color: #fff;
}

.csnh-wagering-card-preview__brand {
  color: var(--csnh-tools-gold);
  font-size: clamp(.73rem, 2.3vw, .98rem);
  font-weight: 900;
  letter-spacing: .13em;
}

.csnh-wagering-card-preview__eyebrow {
  color: #dcecff;
  font-size: clamp(.62rem, 1.8vw, .8rem);
  font-weight: 700;
  letter-spacing: .08em;
}

.csnh-wagering-card-preview__top strong {
  font-size: clamp(1.7rem, 6vw, 2.8rem);
  line-height: 1;
}

.csnh-wagering-card-preview__body {
  display: flex;
  min-width: 0;
  flex-direction: column;
  justify-content: center;
  gap: clamp(.8rem, 3vw, 1.45rem);
  padding: clamp(1rem, 4vw, 1.55rem);
  background: #fff;
}

.csnh-wagering-card-preview__body dl {
  display: grid;
  gap: clamp(.55rem, 2vw, .9rem);
  margin: 0;
}

.csnh-wagering-card-preview__body dl > div {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: .8rem;
  min-width: 0;
  padding-bottom: .55rem;
  border-bottom: 1px solid #dce8f5;
}

.csnh-wagering-card-preview__body dt {
  color: var(--csnh-tools-muted);
  font-size: clamp(.68rem, 2vw, .82rem);
  font-weight: 800;
  letter-spacing: .03em;
  text-transform: uppercase;
}

.csnh-wagering-card-preview__body dd {
  margin: 0;
  color: var(--csnh-tools-navy);
  font-size: clamp(1rem, 3.5vw, 1.45rem);
  font-weight: 900;
  text-align: right;
  overflow-wrap: anywhere;
}

.csnh-wagering-card-preview__body p {
  margin: 0;
  color: var(--csnh-tools-muted);
  font-size: clamp(.67rem, 2vw, .82rem);
  line-height: 1.4;
}

.csnh-wagering-card-preview__bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .6rem;
  padding: .65rem clamp(1rem, 4vw, 1.55rem);
  background: var(--csnh-tools-navy);
  color: #fff;
  font-size: clamp(.65rem, 2vw, .8rem);
}

.csnh-wagering-card-preview__bottom strong { font-weight: 800; }
.csnh-wagering-card-preview__bottom span { color: #dcecff; }

.csnh-wagering-share-card__actions {
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
  align-self: start;
  gap: .65rem;
  margin-top: 0;
  padding: 1rem;
  border: 1px solid #dce8f5;
  border-radius: 12px;
  background: var(--csnh-tools-surface);
}

.csnh-wagering-share-card__actions .csnh-tool-button {
  margin-top: 0;
  font-size: .86rem;
}

.csnh-tool-disclaimer {
  margin: 1rem 0 0;
  color: var(--csnh-tools-muted);
  font-size: .82rem;
  line-height: 1.5;
}

.csnh-tool-field { margin-bottom: 1rem; }
.csnh-tool-field small { display: block; margin-top: .45rem; color: var(--csnh-tools-muted); font-size: .81rem; line-height: 1.45; }

.csnh-regulation-products {
  margin: 0;
  padding: 0;
  border: 0;
}

.csnh-regulation-products legend {
  margin-bottom: .55rem;
  color: var(--csnh-tools-navy);
  font-size: .88rem;
  font-weight: 800;
}

.csnh-regulation-products__choices { display: flex; flex-wrap: wrap; gap: .55rem; }

.csnh-regulation-choice {
  min-height: 42px;
  padding: .55rem .75rem;
  border: 1px solid var(--csnh-tools-line);
  border-radius: 999px;
  background: #fff;
  color: var(--csnh-tools-navy);
  cursor: pointer;
  font: inherit;
  font-size: .88rem;
  font-weight: 750;
}

.csnh-regulation-choice:hover { border-color: var(--csnh-tools-blue); color: var(--csnh-tools-blue); }
.csnh-regulation-choice.is-selected { border-color: var(--csnh-tools-navy); background: var(--csnh-tools-navy); color: #fff; }

.csnh-regulation-result {
  margin-top: 1.2rem;
  padding: 1.1rem;
  border: 1px solid #d9e5f4;
  border-radius: 13px;
  background: var(--csnh-tools-surface);
}

.csnh-regulation-result__topline { display: flex; flex-wrap: wrap; align-items: center; gap: .55rem; }
.csnh-regulation-status {
  display: inline-flex;
  padding: .32rem .56rem;
  border-radius: 999px;
  font-size: .78rem;
  font-weight: 900;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.csnh-regulation-status--regulated { background: #dcfce7; color: #166534; }
.csnh-regulation-status--territorial { background: #fff3d7; color: #8a4b00; }
.csnh-regulation-status--permit-required { background: #dbeafe; color: #1d4ed8; }
.csnh-regulation-status--verification-required { background: #fef3c7; color: #92400e; }
.csnh-regulation-status--specific-regime { background: #ede9fe; color: #6d28d9; }
.csnh-regulation-status--provincial { background: #ffedd5; color: #9a3412; }
.csnh-regulation-status--outside-scope { background: #e2e8f0; color: #334155; }
.csnh-regulation-status--federal-state { background: #cffafe; color: #155e75; }
.csnh-regulation-status--not-authorized { background: #fee2e2; color: #b91c1c; }
.csnh-regulation-status--no-general-authorisation { background: #fce7f3; color: #9d174d; }
.csnh-regulation-country { color: var(--csnh-tools-muted); font-size: .87rem; font-weight: 750; }
.csnh-regulation-result h3 { margin: .75rem 0 .45rem; color: var(--csnh-tools-navy); font-size: 1.22rem; }
.csnh-regulation-result > p { margin: 0; line-height: 1.55; }

.csnh-regulation-facts {
  display: grid;
  gap: .7rem;
  margin: 1rem 0;
}
.csnh-regulation-facts div { display: grid; grid-template-columns: minmax(6.5rem, .7fr) minmax(0, 1.7fr); gap: .75rem; }
.csnh-regulation-facts dt { color: var(--csnh-tools-muted); font-size: .81rem; font-weight: 800; }
.csnh-regulation-facts dd { margin: 0; font-size: .88rem; line-height: 1.4; }

.csnh-source-link {
  display: inline-flex;
  align-items: center;
  gap: .15rem;
  color: var(--csnh-tools-blue);
  font-size: .9rem;
  font-weight: 800;
  text-underline-offset: .15em;
}

.csnh-regulation-review {
  display: grid;
  gap: .2rem;
  margin-top: 1rem;
  padding: .8rem .9rem;
  border: 1px solid #f0b429;
  border-radius: 10px;
  background: #fff8e6;
  color: #7a4b00;
  font-size: .87rem;
  line-height: 1.45;
}
.csnh-regulation-review strong { color: inherit; font-size: .9rem; }
.csnh-regulation-review--source-unavailable { border-color: #fca5a5; background: #fff1f2; color: #9f1239; }
.csnh-regulation-review--source-changed { border-color: #f5c35a; background: #fff9e8; color: #854d0e; }
.csnh-regulation-review--review-due { border-color: #fdba74; background: #fff7ed; color: #9a3412; }

.csnh-license-form__fields {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(0, .8fr);
  gap: .85rem;
  margin-bottom: .85rem;
}

.csnh-license-form label {
  display: grid;
  gap: .4rem;
  color: var(--csnh-tools-navy);
  font-size: .86rem;
  font-weight: 800;
}

.csnh-license-form input,
.csnh-license-form select {
  width: 100%;
  min-height: 44px;
  box-sizing: border-box;
  padding: .65rem .75rem;
  border: 1px solid var(--csnh-tools-line);
  border-radius: 9px;
  background: #fff;
  color: var(--csnh-tools-ink);
  font: inherit;
  font-size: .95rem;
}

.csnh-license-form input:focus,
.csnh-license-form select:focus {
  outline: 3px solid rgba(47, 128, 237, .2);
  border-color: var(--csnh-tools-blue);
}

.csnh-license-form > small {
  display: block;
  margin-top: .65rem;
  color: var(--csnh-tools-muted);
  font-size: .81rem;
  line-height: 1.45;
}

.csnh-license-result {
  margin-top: 1.2rem;
  padding: 1.1rem;
  border: 1px solid #d9e5f4;
  border-radius: 13px;
  background: var(--csnh-tools-surface);
}

.csnh-license-result__topline { display: flex; flex-wrap: wrap; align-items: center; gap: .55rem; }
.csnh-license-status {
  display: inline-flex;
  padding: .32rem .56rem;
  border-radius: 999px;
  font-size: .75rem;
  font-weight: 900;
  letter-spacing: .035em;
  line-height: 1.25;
  text-transform: uppercase;
}
.csnh-license-status--verified-authorized { background: #dcfce7; color: #166534; }
.csnh-license-status--official-match-not-complete { background: #dbeafe; color: #1d4ed8; }
.csnh-license-status--no-match-found { background: #fff3d7; color: #8a4b00; }
.csnh-license-status--data-not-available { background: #e2e8f0; color: #334155; }
.csnh-license-status--suspicious-domain { background: #fee2e2; color: #b91c1c; }
.csnh-license-status--not-yet-verified { background: #fff3d7; color: #8a4b00; }
.csnh-home-payout__evidence { display: inline-flex; width: fit-content; color: #155e75; font-weight: 800; }
.csnh-license-country { color: var(--csnh-tools-muted); font-size: .87rem; font-weight: 750; }
.csnh-license-message { margin: .85rem 0 0; line-height: 1.55; }

.csnh-license-facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .7rem;
  margin: 1rem 0;
}
.csnh-license-facts > div {
  min-width: 0;
  padding: .72rem;
  border: 1px solid #dce8f5;
  border-radius: 10px;
  background: #fff;
}
.csnh-license-facts dt { color: var(--csnh-tools-muted); font-size: .76rem; font-weight: 800; line-height: 1.35; }
.csnh-license-facts dd { margin: .25rem 0 0; color: var(--csnh-tools-navy); font-size: .88rem; font-weight: 700; line-height: 1.4; overflow-wrap: anywhere; }

.csnh-tools__responsible {
  display: flex;
  align-items: flex-start;
  gap: .75rem;
  margin-top: 1.35rem;
  padding: 1rem 1.15rem;
  border-left: 4px solid var(--csnh-tools-gold);
  border-radius: 0 12px 12px 0;
  background: #fffaf0;
}
.csnh-tools__responsible strong { color: var(--csnh-tools-navy); font-size: 1.1rem; }
.csnh-tools__responsible p { margin: 0; color: #5b4a2d; line-height: 1.5; }

@media (max-width: 760px) {
  .csnh-tools__grid { grid-template-columns: 1fr; }
  .csnh-tool-card--featured { display: block; grid-column: auto; }
  .csnh-tool-fields { grid-template-columns: 1fr; }
  .csnh-wagering-result__facts { grid-template-columns: 1fr; }
  .csnh-license-form__fields,
  .csnh-license-facts { grid-template-columns: 1fr; }
  .csnh-tool-button { width: 100%; }
  .csnh-wagering-share { align-items: stretch; }
  .csnh-wagering-share-card__heading { align-items: flex-start; flex-direction: column; gap: .25rem; }
  .csnh-wagering-share-card { grid-template-columns: 1fr; }
  .csnh-wagering-share-card__heading { grid-column: auto; }
  .csnh-wagering-share-card__actions { margin-top: 1rem; }
}

@media (max-width: 430px) {
  .csnh-tools__hero,
  .csnh-tool-card { border-radius: 13px; }
  .csnh-regulation-facts div { grid-template-columns: 1fr; gap: .16rem; }
  .csnh-license-facts { gap: .55rem; }
  .csnh-regulation-products__choices { display: grid; grid-template-columns: 1fr 1fr; }
  .csnh-regulation-choice { width: 100%; }
  .csnh-tools__quicknav { grid-template-columns: 1fr; }
}
