/* Special Elite and Permanent Marker are provided centrally by the site. */

.fpr-idea-tool {
  --fpr-charcoal: var(--fpr-color-charcoal, #333333);
  --fpr-pink: var(--fpr-color-magenta, #D6014B);
  --fpr-yellow: var(--fpr-color-yellow, #FFD447);
  --fpr-blue: var(--fpr-color-blue, #0587CB);
  --fpr-cyan: var(--fpr-color-cyan, #02ADEE);
  --fpr-ink: var(--fpr-color-text, #212529);
  --fpr-paper: var(--fpr-color-white, #FFFFFF);
  --fpr-soft: color-mix(in srgb, var(--fpr-charcoal) 4%, var(--fpr-paper));
  --fpr-border: color-mix(in srgb, var(--fpr-charcoal) 24%, transparent);
  --fpr-muted: var(--fpr-charcoal);
  --fpr-font-body: "Special Elite", Georgia, serif;
  --fpr-font-heading: "Permanent Marker", cursive;
  --fpr-text-body: 1rem;
  --fpr-text-lead: 1.05rem;
  --fpr-text-title: clamp(1.6rem, 4vw, 2.25rem);
  --fpr-text-section: clamp(1.4rem, 3vw, 1.85rem);
  --fpr-text-card: clamp(1.18rem, 2.5vw, 1.45rem);
  --fpr-text-label: 0.78rem;
  --fpr-text-note: 0.94rem;
  --fpr-text-small: 0.875rem;
  --fpr-text-button: 0.92rem;
  --fpr-leading-body: 1.75;
  --fpr-leading-note: 1.65;
  --fpr-panel-padding: clamp(1.35rem, 3vw, 1.8rem);
  --fpr-panel-radius: 13px;
  --fpr-radius: var(--fpr-panel-radius);
  --fpr-shadow: 0 12px 34px color-mix(in srgb, var(--fpr-charcoal) 11%, transparent);
  width: min(var(--fpr-max-width, 1080px), 100%);
  margin: 0 auto 2.5rem;
  color: var(--fpr-ink);
  font-family: var(--fpr-font-body);
  font-size: var(--fpr-text-body);
  line-height: var(--fpr-leading-body);
  box-sizing: border-box;
  isolation: isolate;
}

.fpr-idea-tool * {
  box-sizing: border-box;
}

.fpr-idea-tool__header,
.fpr-idea-tool__body {
  background: var(--fpr-paper);
  border: 1px solid var(--fpr-border);
  border-radius: var(--fpr-radius);
  box-shadow: var(--fpr-shadow);
}

.fpr-idea-tool__header {
  position: relative;
  overflow: hidden;
  padding: var(--fpr-panel-padding);
  margin-bottom: 2rem;
  border-top: 7px solid var(--fpr-pink);
  background: var(--fpr-paper);
}

.fpr-idea-tool__header-content {
  position: relative;
  z-index: 2;
  max-width: 780px;
}

.fpr-idea-tool__badge {
  display: inline-block;
  margin-bottom: 1.05rem;
  padding: .45rem .7rem .35rem;
  border: 2px solid var(--fpr-charcoal);
  border-radius: 4px;
  background: var(--fpr-yellow);
  color: var(--fpr-yellow-text, var(--fpr-ink));
  box-shadow: 3px 3px 0 var(--fpr-charcoal);
  font-size: var(--fpr-text-label);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: .08em;
  text-transform: uppercase;
  transform: rotate(-1deg);
}

.fpr-idea-tool__header h2 {
  margin: 0;
  color: var(--fpr-pink);
  font-family: var(--fpr-font-heading);
  font-size: var(--fpr-text-title);
  font-weight: 400;
  line-height: 1.25;
  text-wrap: balance;
}

.fpr-idea-tool__intro {
  max-width: 720px;
  margin: .85rem 0 0;
  font-size: var(--fpr-text-lead);
  line-height: var(--fpr-leading-body);
}

.fpr-idea-tool__intro p {
  margin: 0 0 .85rem;
}

.fpr-idea-tool__intro > :last-child,
.fpr-idea-tool .fpr-idea-tool__next-step-text > :last-child {
  margin-bottom: 0;
}

.fpr-idea-tool .fpr-idea-tool__next-step {
  width: 100%;
  margin-top: 2.5rem;
  padding: var(--fpr-panel-padding);
  border: 1px solid var(--fpr-charcoal);
  border-left: 6px solid var(--fpr-pink);
  border-radius: var(--fpr-radius);
  background: var(--fpr-charcoal);
  color: var(--fpr-paper);
  box-shadow: 0 5px 16px color-mix(in srgb, var(--fpr-charcoal) 16%, transparent);
  overflow-wrap: anywhere;
}

.fpr-idea-tool .fpr-idea-tool__next-step h3 {
  margin: 0 0 .85rem;
  color: var(--fpr-paper);
  font: 400 var(--fpr-text-card)/1.4 var(--fpr-font-heading);
}

.fpr-idea-tool .fpr-idea-tool__next-step-text {
  color: var(--fpr-paper);
  font-size: var(--fpr-text-body);
  line-height: var(--fpr-leading-body);
}

.fpr-idea-tool .fpr-idea-tool__next-step-text p {
  margin: 0 0 .85rem;
  color: var(--fpr-paper);
}

.fpr-idea-tool__intro a {
  color: var(--fpr-pink);
  font-weight: 700;
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: .18em;
}

.fpr-idea-tool__intro a:hover {
  color: var(--fpr-charcoal);
  text-decoration-thickness: 3px;
}

.fpr-idea-tool__intro a:focus-visible {
  outline: 2px solid var(--fpr-charcoal);
  outline-offset: 2px;
  box-shadow: 0 0 0 2px var(--fpr-paper);
  border-radius: 2px;
}

.fpr-idea-tool .fpr-idea-tool__next-step a {
  color: var(--fpr-paper);
  font-weight: 700;
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: .18em;
}

.fpr-idea-tool .fpr-idea-tool__next-step a:hover {
  color: var(--fpr-cyan);
  text-decoration-thickness: 3px;
}

.fpr-idea-tool .fpr-idea-tool__next-step a:focus-visible {
  outline: 2px solid var(--fpr-charcoal);
  outline-offset: 2px;
  box-shadow: 0 0 0 2px var(--fpr-paper);
  border-radius: 2px;
}

.fpr-idea-tool__pattern {
  position: absolute;
  inset: 0;
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  align-content: space-around;
  gap: 14px;
  padding: 18px;
  opacity: .09;
  transform: rotate(-5deg) scale(1.08);
  pointer-events: none;
}

.fpr-idea-tool__pattern span {
  font-family: var(--fpr-font-heading);
  font-size: clamp(1.5rem, 4vw, 3.6rem);
  text-align: center;
}

.fpr-idea-tool__body {
  margin-top: 0;
  padding: var(--fpr-panel-padding);
  background: var(--fpr-soft);
}

.fpr-idea-tool__count {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  flex-wrap: wrap;
  margin: 0 auto 24px;
  color: var(--fpr-muted);
  font-size: var(--fpr-text-label);
  line-height: 1.3;
  letter-spacing: .05em;
  text-align: center;
  text-transform: uppercase;
}

.fpr-idea-tool__count strong {
  padding: 8px 14px;
  border: 2px solid var(--fpr-blue);
  border-radius: 999px;
  background: var(--fpr-paper);
  color: var(--fpr-ink);
  font-size: 1.1rem;
}

.fpr-idea-tool__paper-stage {
  position: relative;
  margin-top: 8px;
  isolation: isolate;
}

.fpr-idea-tool__paper {
  position: relative;
  min-height: 260px;
  display: grid;
  align-content: center;
  justify-items: center;
  padding: clamp(50px, 7vw, 76px) clamp(26px, 7vw, 76px);
  text-align: center;
}

.fpr-idea-tool__paper > * {
  position: relative;
  z-index: 1;
}

.fpr-idea-tool__tape {
  position: absolute;
  z-index: 4;
  top: -13px;
  width: 92px;
  height: 31px;
  border: 1px solid color-mix(in srgb, var(--fpr-charcoal) 14%, transparent);
  background-color: color-mix(in srgb, var(--fpr-yellow) 76%, transparent);
  background-image:
    linear-gradient(100deg, color-mix(in srgb, var(--fpr-paper) 28%, transparent), transparent 42%, color-mix(in srgb, var(--fpr-charcoal) 5%, transparent)),
    repeating-linear-gradient(90deg, transparent 0 6px, color-mix(in srgb, var(--fpr-paper) 8%, transparent) 6px 7px);
  box-shadow: 0 2px 3px color-mix(in srgb, var(--fpr-charcoal) 12%, transparent);
  clip-path: polygon(1% 9%, 98% 0, 100% 91%, 3% 100%, 0 58%);
  pointer-events: none;
}

.fpr-idea-tool__tape--left {
  left: 8%;
  transform: rotate(-7deg);
}

.fpr-idea-tool__tape--right {
  right: 8%;
  transform: rotate(6deg);
}

/* Default: a lightweight CSS notebook sheet with no external image asset. */
.fpr-idea-tool.fpr-paper--notebook {
  --fpr-notebook-margin: 64px;
  --fpr-rule-color: color-mix(in srgb, var(--fpr-blue) 14.5%, transparent);
  --fpr-margin-color: color-mix(in srgb, var(--fpr-pink) 18%, transparent);
}

.fpr-idea-tool.fpr-paper--notebook .fpr-idea-tool__paper {
  padding-left: clamp(72px, 9vw, 102px);
  padding-right: clamp(34px, 7vw, 78px);
  border: 0;
  background-color: var(--fpr-paper);
  background-image:
    linear-gradient(
      to right,
      transparent 0,
      transparent calc(var(--fpr-notebook-margin) - 1px),
      var(--fpr-margin-color) calc(var(--fpr-notebook-margin) - 1px),
      var(--fpr-margin-color) calc(var(--fpr-notebook-margin) + 1px),
      transparent calc(var(--fpr-notebook-margin) + 1px)
    ),
    repeating-linear-gradient(
      to bottom,
      transparent 0,
      transparent 31px,
      var(--fpr-rule-color) 31px,
      var(--fpr-rule-color) 32px
    ),
    radial-gradient(circle at 22% 31%, color-mix(in srgb, var(--fpr-charcoal) 3.5%, transparent) 0 .55px, transparent .9px),
    linear-gradient(104deg, color-mix(in srgb, var(--fpr-paper) 58%, transparent), color-mix(in srgb, var(--fpr-charcoal) 12%, transparent) 48%, color-mix(in srgb, var(--fpr-paper) 26%, transparent));
  background-size: auto, auto, 17px 19px, auto;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--fpr-charcoal) 7%, transparent);
  clip-path: polygon(
    .4% 2.2%, 3.8% 1%, 7.4% 1.9%, 11.2% .6%, 15% 1.8%, 18.8% .8%,
    23% 1.7%, 27% .5%, 31.3% 1.7%, 35.5% .7%, 39.8% 1.8%, 44.2% .6%,
    48.4% 1.6%, 52.7% .5%, 57% 1.8%, 61.5% .7%, 65.8% 1.7%, 70.2% .5%,
    74.7% 1.8%, 79% .7%, 83.4% 1.7%, 87.6% .5%, 91.7% 1.8%, 95.8% .8%,
    99.5% 2%, 99.7% 97.2%, 96.2% 98.8%, 92.5% 97.7%, 88.7% 99.2%,
    84.6% 97.8%, 80.8% 99.1%, 76.7% 97.6%, 72.5% 99.2%, 68.3% 97.9%,
    64.1% 99.3%, 59.8% 97.7%, 55.5% 99.1%, 51.2% 97.8%, 46.8% 99.3%,
    42.5% 97.7%, 38.2% 99.1%, 34% 97.6%, 29.7% 99.2%, 25.3% 97.8%,
    21% 99.1%, 16.7% 97.7%, 12.3% 99.2%, 8.1% 97.8%, 4.2% 99%, .3% 97.6%
  );
  filter: drop-shadow(8px 10px 0 color-mix(in srgb, var(--fpr-charcoal) 14%, transparent)) drop-shadow(0 5px 5px color-mix(in srgb, var(--fpr-charcoal) 10%, transparent));
  transform: rotate(-.32deg);
}

.fpr-idea-tool.fpr-paper--notebook .fpr-idea-tool__paper::before {
  content: "";
  position: absolute;
  z-index: 2;
  top: 25px;
  bottom: 25px;
  left: 11px;
  width: 18px;
  background-image: radial-gradient(
    circle at center,
    var(--fpr-soft) 0 4px,
    color-mix(in srgb, var(--fpr-charcoal) 20%, transparent) 4.3px 5px,
    transparent 5.4px
  );
  background-position: center 2px;
  background-repeat: repeat-y;
  background-size: 18px 32px;
  opacity: .9;
  pointer-events: none;
}

.fpr-idea-tool.fpr-paper--notebook .fpr-idea-tool__paper::after {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 0;
  background:
    linear-gradient(92deg, transparent 0 43%, color-mix(in srgb, var(--fpr-charcoal) 2.2%, transparent) 48%, color-mix(in srgb, var(--fpr-paper) 22%, transparent) 50%, transparent 56%),
    repeating-linear-gradient(118deg, transparent 0 39px, color-mix(in srgb, var(--fpr-charcoal) 1.2%, transparent) 40px, transparent 41px 77px);
  mix-blend-mode: multiply;
  pointer-events: none;
}

.fpr-idea-tool.fpr-paper--notebook .fpr-idea-tool__tape--left {
  left: 9%;
}

.fpr-idea-tool.fpr-paper--notebook .fpr-idea-tool__tape--right {
  right: 7%;
}

/* Optional legacy presentation, available from the module settings. */
.fpr-idea-tool.fpr-paper--clean .fpr-idea-tool__paper {
  border: 2px solid var(--fpr-ink);
  background-color: var(--fpr-paper);
  background-image: linear-gradient(color-mix(in srgb, var(--fpr-blue) 7%, transparent) 1px, transparent 1px);
  background-size: 100% 32px;
  box-shadow: 8px 8px 0 color-mix(in srgb, var(--fpr-charcoal) 15%, transparent);
  transform: rotate(-.25deg);
}

.fpr-idea-tool__eyebrow {
  margin: 0 0 17px;
  color: var(--fpr-muted);
  font-size: var(--fpr-text-label);
  font-weight: 800;
  line-height: 1.3;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.fpr-idea-tool__result {
  max-width: 820px;
  margin: 0;
  font-size: clamp(1.3rem, 3.2vw, 2.15rem);
  font-weight: 700;
  line-height: 1.45;
  text-wrap: balance;
}

.fpr-idea-tool__result.is-new {
  animation: fprIdeaReveal .4s ease both;
}

@keyframes fprIdeaReveal {
  from {
    opacity: 0;
    transform: translateY(8px) rotate(-.4deg);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

.fpr-idea-tool__status {
  min-height: 1.4em;
  margin: 18px 0 0;
  color: var(--fpr-muted);
  font-size: var(--fpr-text-note);
  line-height: var(--fpr-leading-note);
  font-weight: 800;
}

.fpr-idea-tool__actions {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 28px;
}

.fpr-idea-tool .fpr-button {
  min-height: 52px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  padding: 13px 22px;
  border: 2px solid var(--fpr-charcoal);
  border-radius: 8px;
  font: 800 var(--fpr-text-button)/1.3 var(--fpr-font-body);
  cursor: pointer;
  box-shadow: 4px 4px 0 var(--fpr-charcoal);
  transition: transform .15s ease, box-shadow .15s ease, background-color .15s ease, color .15s ease;
}

.fpr-idea-tool .fpr-button:hover {
  transform: translate(-2px, -2px);
  box-shadow: 6px 6px 0 var(--fpr-charcoal);
}

.fpr-idea-tool .fpr-button:active {
  transform: translate(3px, 3px);
  box-shadow: 1px 1px 0 var(--fpr-charcoal);
}

.fpr-idea-tool .fpr-button:focus-visible {
  outline: 2px solid var(--fpr-charcoal);
  outline-offset: 2px;
  box-shadow: 0 0 0 2px var(--fpr-paper);
}

.fpr-idea-tool .fpr-button--primary {
  background: var(--fpr-pink);
  border-color: var(--fpr-pink);
  color: var(--fpr-pink-text, var(--fpr-paper));
}

.fpr-idea-tool .fpr-button--primary:hover {
  background: var(--fpr-charcoal);
  border-color: var(--fpr-charcoal);
  color: var(--fpr-paper);
}

.fpr-idea-tool .fpr-button--secondary {
  background: var(--fpr-paper);
  border-color: var(--fpr-blue);
  color: var(--fpr-ink);
}

.fpr-idea-tool .fpr-button--secondary:hover {
  background: var(--fpr-cyan);
  color: var(--fpr-ink);
}

.fpr-idea-tool .fpr-button:disabled {
  background: var(--fpr-soft);
  border-color: var(--fpr-border);
  color: var(--fpr-muted);
  opacity: 1;
  cursor: not-allowed;
  transform: none;
  box-shadow: 2px 2px 0 var(--fpr-charcoal);
}

.fpr-idea-tool__noscript {
  padding: 12px;
  border-left: 4px solid var(--fpr-pink);
  background: var(--fpr-paper);
  font-size: var(--fpr-text-note);
  line-height: var(--fpr-leading-note);
}

.fpr-idea-tool .fpr-button,
.fpr-idea-tool .fpr-button:hover {
  text-decoration: none;
}

@supports not (clip-path: polygon(0 0)) {
  .fpr-idea-tool.fpr-paper--notebook .fpr-idea-tool__paper {
    border: 1px solid color-mix(in srgb, var(--fpr-charcoal) 28%, transparent);
    filter: none;
    box-shadow: 8px 10px 0 color-mix(in srgb, var(--fpr-charcoal) 14%, transparent);
  }

  .fpr-idea-tool__tape {
    clip-path: none;
  }
}

@media (max-width: 600px) {
  .fpr-idea-tool__header {
    padding: 1.25rem 1.05rem;
    border-top-width: 6px;
  }

  .fpr-idea-tool__intro {
    font-size: var(--fpr-text-body);
  }

  .fpr-idea-tool .fpr-idea-tool__next-step {
    padding: 1.25rem 1.05rem;
  }

  .fpr-idea-tool__body {
    padding: 18px 14px 24px;
  }

  .fpr-idea-tool__paper {
    min-height: 290px;
  }

  .fpr-idea-tool.fpr-paper--notebook {
    --fpr-notebook-margin: 43px;
  }

  .fpr-idea-tool.fpr-paper--notebook .fpr-idea-tool__paper {
    padding: 58px 22px 46px 52px;
    filter: drop-shadow(5px 7px 0 color-mix(in srgb, var(--fpr-charcoal) 14%, transparent)) drop-shadow(0 4px 4px color-mix(in srgb, var(--fpr-charcoal) 8%, transparent));
  }

  .fpr-idea-tool.fpr-paper--notebook .fpr-idea-tool__paper::before {
    left: 7px;
    width: 15px;
    background-size: 15px 32px;
  }

  .fpr-idea-tool.fpr-paper--clean .fpr-idea-tool__paper {
    padding: 54px 18px 38px;
    box-shadow: 5px 5px 0 color-mix(in srgb, var(--fpr-charcoal) 15%, transparent);
  }

  .fpr-idea-tool__tape {
    width: 72px;
    height: 27px;
  }

  .fpr-idea-tool .fpr-button {
    width: 100%;
  }

  .fpr-idea-tool__count {
    font-size: var(--fpr-text-label);
  }
}

@media (prefers-reduced-motion: reduce) {
  .fpr-idea-tool__result.is-new,
  .fpr-idea-tool .fpr-button {
    animation: none;
    transition: none;
  }
}