/*
 * FOK showcase quiz contrast/stability layer.
 * Static gradients only: no animation, filter or transform is applied.
 */
.fok-showcase .shock-test fieldset {
  border-color: rgba(177, 198, 211, 0.34);
  background:
    linear-gradient(
      135deg,
      rgba(13, 29, 42, 0.96) 0%,
      rgba(13, 29, 42, 0.88) 72%,
      rgba(17, 194, 171, 0.08) 100%
    );
  box-shadow:
    0 20px 52px rgba(5, 8, 12, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.fok-showcase .shock-test fieldset > legend {
  max-width: calc(100% - 1.25rem);
  padding: 0.58rem 1rem 0.64rem;
  border: 1px solid rgba(177, 198, 211, 0.32);
  border-radius: 0.8rem;
  color: #ffffff;
  background:
    linear-gradient(
      90deg,
      #09151f 0%,
      #0d1d2a 76%,
      #132d3c 100%
    );
  box-shadow:
    0 9px 26px rgba(5, 8, 12, 0.26),
    inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

.fok-showcase .shock-test fieldset > legend > span {
  flex: 0 0 auto;
  color: #ff665f;
  font-weight: 800;
}

.fok-showcase .shock-test fieldset > legend > b {
  min-width: 0;
  color: #ffffff;
  font-weight: 800;
  overflow-wrap: anywhere;
}

.fok-showcase .shock-test fieldset > label,
.fok-showcase .shock-test .check-grid label {
  border-color: rgba(177, 198, 211, 0.08);
  background:
    linear-gradient(
      90deg,
      rgba(255, 255, 255, 0.055) 0%,
      rgba(255, 255, 255, 0.035) 72%,
      rgba(255, 255, 255, 0.018) 100%
    );
}

@media (max-width: 720px) {
  .fok-showcase .shock-test fieldset {
    padding: 1.05rem;
    border-radius: 1rem;
  }

  .fok-showcase .shock-test fieldset > legend {
    width: auto;
    max-width: calc(100% - 0.5rem);
    gap: 0.62rem;
    padding: 0.52rem 0.72rem 0.58rem;
    font-size: 0.98rem;
    line-height: 1.35;
  }
}

@media (prefers-contrast: more) {
  .fok-showcase .shock-test fieldset {
    border-color: rgba(255, 255, 255, 0.52);
  }

  .fok-showcase .shock-test fieldset > legend {
    border-color: rgba(255, 255, 255, 0.66);
    background: #09151f;
  }
}