/* NSFWRating app finder (modal quiz) - house sticker style.
   Loaded site-wide by novamira-sandbox/aihub-finder.php. */

.nsrf-open,
.nsrf-drw,
.nsrf-fab { font-family: var(--sans, "Plus Jakarta Sans", sans-serif); }

/* ---------- header trigger (desktop nav) ---------- */
#hdr .nav .nsrf-open,
.hdr .nav .nsrf-open {
  display: inline-flex; align-items: center; gap: 7px;
  border: 2px solid var(--black, #0A0A0A);
  background: var(--pink, #F92FBB); color: #fff;
  font: 700 .875rem/1 var(--sans, sans-serif);
  padding: 9px 14px; border-radius: var(--r-pill, 999px);
  cursor: pointer; white-space: nowrap;
  box-shadow: 2px 2px 0 var(--black, #0A0A0A);
  transition: transform .14s ease, box-shadow .14s ease, background .14s ease;
}
#hdr .nav .nsrf-open:hover,
.hdr .nav .nsrf-open:hover {
  transform: translate(-1px, -1px);
  box-shadow: 3px 3px 0 var(--black, #0A0A0A);
  background: var(--pink-2, #D40F9C); color: #fff;
}
#hdr .nav .nsrf-open:focus-visible,
.hdr .nav .nsrf-open:focus-visible { outline: 3px solid var(--violet, #8B5CF6); outline-offset: 2px; }
.nsrf-open svg { flex: 0 0 auto; }

/* ---------- drawer trigger (mobile) ---------- */
#drw .drw__in a.nsrf-drw,
.drw .drw__in a.nsrf-drw {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  color: #fff !important; background: var(--pink, #F92FBB);
  border: 2px solid var(--black, #0A0A0A); border-radius: var(--r-sm, 14px);
  padding: 12px 14px; font-weight: 800; margin: 6px 0 2px;
  box-shadow: 2px 2px 0 var(--black, #0A0A0A);
}
#drw .drw__in a.nsrf-drw span,
.drw .drw__in a.nsrf-drw span {
  background: #fff; color: var(--black, #0A0A0A);
  border-radius: var(--r-pill, 999px); padding: 2px 9px;
  font: 800 .68rem/1.5 var(--sans, sans-serif); letter-spacing: .03em;
}

/* ---------- floating pill ---------- */
.nsrf-fab {
  position: fixed; right: 20px; bottom: 82px; z-index: 950;
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--pink, #F92FBB); color: #fff;
  border: 2.5px solid var(--black, #0A0A0A); border-radius: var(--r-pill, 999px);
  padding: 12px 18px; cursor: pointer;
  font: 800 .875rem/1 var(--sans, sans-serif);
  box-shadow: 3px 3px 0 var(--black, #0A0A0A);
  transition: transform .15s ease, box-shadow .15s ease, opacity .2s ease;
}
.nsrf-fab:hover { transform: translate(-1px, -1px); box-shadow: 5px 5px 0 var(--black, #0A0A0A); }
.nsrf-fab[hidden] { display: none; }
@media (max-width: 700px) { .nsrf-fab { right: 14px; bottom: 76px; padding: 10px 15px; font-size: .8rem; } }

/* ---------- shell ---------- */
.nsrf { position: fixed; inset: 0; z-index: 99990; display: none; }
.nsrf.is-open { display: flex; align-items: center; justify-content: center; padding: 14px; }
.nsrf__ovl {
  position: absolute; inset: 0; background: rgba(10, 10, 10, .74);
  -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px);
  animation: nsrf-fade .18s ease;
}
@keyframes nsrf-fade { from { opacity: 0 } to { opacity: 1 } }
/* Opacity only: a transform here scales the whole dialog, and if the
   animation is ever paused mid-run the frozen scale corrupts child layout
   (a 15px icon measured 1px wide). */
@keyframes nsrf-pop { from { opacity: 0 } to { opacity: 1 } }

.nsrf__dlg {
  position: relative;
  width: min(940px, 100%);
  max-height: min(92vh, 900px); overflow: auto; -webkit-overflow-scrolling: touch;
  background: var(--cream, #FFF8EF); color: var(--black, #0A0A0A);
  border: 3px solid var(--black, #0A0A0A); border-radius: 26px;
  box-shadow: 8px 8px 0 var(--black, #0A0A0A);
  padding: clamp(20px, 3.4vw, 36px);
  animation: nsrf-pop .22s cubic-bezier(.2, .9, .3, 1);
}
@media (prefers-reduced-motion: reduce) { .nsrf__ovl, .nsrf__dlg { animation: none } }

.nsrf__x {
  position: absolute; top: 14px; right: 14px; width: 38px; height: 38px;
  display: grid; place-items: center; cursor: pointer;
  background: #fff; color: var(--black, #0A0A0A);
  border: 2px solid var(--black, #0A0A0A); border-radius: 50%;
}
.nsrf__x:hover { background: var(--black, #0A0A0A); color: #fff; }

/* ---------- head ---------- */
.nsrf__hd { text-align: center; max-width: 620px; margin: 0 auto 18px; }
.nsrf__kick {
  display: inline-block; font: 700 .7rem/1 var(--mono, monospace);
  letter-spacing: .14em; text-transform: uppercase;
  color: var(--pink-2, #D40F9C); margin-bottom: 10px;
}
.nsrf__hd h2 {
  font-family: var(--display, Georgia, serif); font-weight: 800;
  font-size: clamp(1.5rem, 3.4vw, 2.35rem); line-height: 1.08;
  letter-spacing: -.02em; margin: 0 0 8px;
}
.nsrf__sub { margin: 0; font-size: .92rem; color: var(--tx-70, rgba(10, 10, 10, .7)); }

.nsrf__bar {
  height: 7px; border: 2px solid var(--black, #0A0A0A); border-radius: 999px;
  background: #fff; overflow: hidden; margin: 18px auto 22px; max-width: 460px;
}
.nsrf__bar i { display: block; height: 100%; width: 25%; background: var(--pink, #F92FBB); transition: width .28s ease; }

/* ---------- steps ---------- */
.nsrf__step[hidden] { display: none; }
.nsrf__no { display: block; text-align: center; font: 800 .72rem/1 var(--mono, monospace); letter-spacing: .12em; text-transform: uppercase; color: var(--pink-2, #D40F9C); margin-bottom: 9px; }
.nsrf__q { text-align: center; font-family: var(--display, Georgia, serif); font-weight: 800; font-size: clamp(1.15rem, 2.4vw, 1.65rem); line-height: 1.15; margin: 0 0 6px; }
.nsrf__hint { text-align: center; margin: 0 0 20px; font-size: .84rem; color: var(--tx-52, rgba(10, 10, 10, .52)); }

.nsrf__opts { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; }
.nsrf__opt {
  flex: 1 1 150px; max-width: 210px; min-width: 0;
  display: flex; flex-direction: column; align-items: center; gap: 5px;
  background: #fff; color: var(--black, #0A0A0A);
  border: 2.5px solid var(--black, #0A0A0A); border-radius: var(--r-md, 18px);
  padding: 16px 12px; cursor: pointer; text-align: center;
  font: 800 .95rem/1.2 var(--sans, sans-serif);
  transition: transform .13s ease, box-shadow .13s ease, background .13s ease, color .13s ease;
}
.nsrf__opt small { font-weight: 500; font-size: .74rem; line-height: 1.3; color: var(--tx-52, rgba(10, 10, 10, .52)); }
.nsrf__opt:hover { transform: translate(-1px, -1px); box-shadow: 3px 3px 0 var(--black, #0A0A0A); }
.nsrf__opt[aria-pressed="true"] {
  background: var(--pink, #F92FBB); color: #fff;
  box-shadow: 3px 3px 0 var(--black, #0A0A0A);
}
.nsrf__opt[aria-pressed="true"] small { color: rgba(255, 255, 255, .84); }
@media (max-width: 560px) { .nsrf__opt { flex: 1 1 calc(50% - 12px); max-width: none; padding: 13px 10px; font-size: .87rem; } }

/* ---------- footer nav ---------- */
.nsrf__ft { display: flex; gap: 12px; justify-content: center; align-items: center; margin-top: 26px; flex-wrap: wrap; }
.nsrf__btn {
  border: 2.5px solid var(--black, #0A0A0A); border-radius: var(--r-pill, 999px);
  padding: 12px 26px; cursor: pointer; font: 800 .9rem/1 var(--sans, sans-serif);
  background: #fff; color: var(--black, #0A0A0A);
  transition: transform .13s ease, box-shadow .13s ease;
}
.nsrf__btn:hover { transform: translate(-1px, -1px); box-shadow: 3px 3px 0 var(--black, #0A0A0A); }
.nsrf__btn--go { background: var(--pink, #F92FBB); color: #fff; }
.nsrf__btn[disabled] { opacity: .45; cursor: not-allowed; transform: none; box-shadow: none; }

.nsrf__disc {
  margin: 22px auto 0; max-width: 660px; text-align: center;
  font-size: .73rem; line-height: 1.55; color: var(--tx-52, rgba(10, 10, 10, .52));
}
.nsrf__disc a { color: inherit; text-decoration: underline; }

/* ---------- results ---------- */
.nsrf__res { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; align-items: stretch; margin-top: 4px; }
@media (max-width: 820px) { .nsrf__res { grid-template-columns: minmax(0, 1fr); } }

.nsrf-card {
  position: relative; display: flex; flex-direction: column; gap: 10px;
  background: #fff; border: 2.5px solid var(--black, #0A0A0A);
  border-radius: var(--r-lg, 24px); padding: 18px 16px 16px; text-align: center;
}
.nsrf-card--top { border-color: var(--pink, #F92FBB); box-shadow: 4px 4px 0 var(--pink, #F92FBB); }
.nsrf-card__flag {
  position: absolute; top: -13px; left: 50%; transform: translateX(-50%);
  background: var(--pink, #F92FBB); color: #fff; white-space: nowrap;
  border: 2px solid var(--black, #0A0A0A); border-radius: 999px;
  font: 800 .66rem/1 var(--sans, sans-serif); letter-spacing: .04em;
  text-transform: uppercase; padding: 6px 12px;
}
.nsrf-card__logo {
  width: 62px; height: 62px; margin: 6px auto 0; border-radius: 16px;
  border: 2px solid var(--black, #0A0A0A); background: #fff;
  object-fit: contain; padding: 6px; display: block;
}
.nsrf-card__ph { display: grid; place-items: center; font: 800 1.5rem/1 var(--display, serif); background: var(--cream-2, #FFF2E0); }
.nsrf-card__n { font-family: var(--display, Georgia, serif); font-weight: 800; font-size: 1.12rem; margin: 4px 0 0; }
.nsrf-card__m { margin: 0; font: 800 .84rem/1 var(--sans, sans-serif); color: var(--pink-2, #D40F9C); }

.nsrf-card__why { list-style: none; margin: 6px 0 0; padding: 10px 0 0; border-top: 2px dashed var(--tx-12, rgba(10, 10, 10, .12)); text-align: left; display: grid; gap: 6px; }
.nsrf-card__why li { display: flex; gap: 8px; font-size: .8rem; line-height: 1.4; }
.nsrf-card__why b { color: var(--green, #00B67A); flex: 0 0 auto; }

.nsrf-card__meta { display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; margin-top: auto; padding-top: 10px; }
.nsrf-chip {
  font: 700 .68rem/1 var(--sans, sans-serif); border-radius: 999px;
  border: 1.5px solid var(--tx-12, rgba(10, 10, 10, .12)); padding: 5px 9px;
  background: var(--cream-2, #FFF2E0); color: var(--tx-70, rgba(10, 10, 10, .7));
}
.nsrf-chip--score { background: var(--black, #0A0A0A); color: #fff; border-color: var(--black, #0A0A0A); }
.nsrf-chip--ad { background: var(--butter, #FFE36E); color: var(--black, #0A0A0A); border-color: var(--black, #0A0A0A); }

.nsrf-card__cta {
  display: block; margin-top: 10px; text-align: center; text-decoration: none;
  background: var(--pink, #F92FBB); color: #fff !important;
  border: 2.5px solid var(--black, #0A0A0A); border-radius: var(--r-pill, 999px);
  padding: 11px 14px; font: 800 .86rem/1 var(--sans, sans-serif);
  transition: transform .13s ease, box-shadow .13s ease;
}
.nsrf-card__cta:hover { transform: translate(-1px, -1px); box-shadow: 3px 3px 0 var(--black, #0A0A0A); color: #fff !important; }
.nsrf-card__rev { display: inline-block; margin-top: 8px; font: 700 .76rem/1 var(--sans, sans-serif); color: var(--black, #0A0A0A) !important; text-decoration: underline; }

.nsrf__empty { text-align: center; font-size: .9rem; color: var(--tx-70, rgba(10, 10, 10, .7)); padding: 26px 0; }

body.nsrf-lock { overflow: hidden; }

/* Theme rules squash bare <svg> to 1px wide, so pin our icon sizes. */
.nsrf svg, .nsrf-open svg, .nsrf-fab svg, .nsrf-drw svg {
  width: 16px !important; height: 16px !important; flex: 0 0 auto; display: block;
}
.nsrf__x svg { width: 15px !important; height: 15px !important; }

.nsrf-card__best {
  margin: 8px 0 0; text-align: left; font-size: .74rem; line-height: 1.45;
  color: var(--tx-52, rgba(10, 10, 10, .52));
}
.nsrf-card__best b { color: var(--tx-70, rgba(10, 10, 10, .7)); }

#nsrf .nsrf__x svg, #nsrf .nsrf__x svg[width] {
  width: 15px !important; height: 15px !important; min-width: 15px; max-width: none;
}

.nsrf__note {
  max-width: 620px; margin: 0 auto 16px; text-align: center;
  background: var(--butter-2, #FFEFA6); border: 2px solid var(--black, #0A0A0A);
  border-radius: var(--r-sm, 14px); padding: 9px 14px;
  font: 600 .78rem/1.45 var(--sans, sans-serif); color: var(--black, #0A0A0A);
}

/* Compact fallback when the header bar has no room for the label. */
.nsrf-navit.is-mini .nsrf-open span { display: none; }
#hdr .nav .nsrf-navit.is-mini .nsrf-open,
.hdr .nav .nsrf-navit.is-mini .nsrf-open { padding: 9px 11px; gap: 0; }
.nsrf-navit[hidden] { display: none; }