/* =========================================================
   FPS TOOL Landing / v0.4.138
   ========================================================= */

.fpsj-theme .fpsj-fps-tool-landing {
  --fpsj-tool-cyan:#31d7ff;
  --fpsj-tool-blue:#3478ff;
  --fpsj-tool-violet:#8c63ff;
}

.fpsj-theme .fpsj-fps-tool-landing-hero {
  background:
    radial-gradient(circle at 84% 12%,rgba(49,215,255,.13),transparent 30%),
    radial-gradient(circle at 18% 0,rgba(140,99,255,.13),transparent 34%),
    linear-gradient(135deg,rgba(9,22,40,.98),rgba(5,13,24,.99));
}

.fpsj-theme .fpsj-fps-tool-landing-hero__row {
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:end;
  gap:30px;
}

.fpsj-theme .fpsj-fps-tool-landing-hero__meta {
  display:grid;
  grid-template-columns:repeat(2,auto);
  gap:8px;
}

.fpsj-theme .fpsj-fps-tool-landing-hero__meta > span {
  display:grid;
  grid-template-columns:auto auto;
  align-items:end;
  gap:7px;
  min-width:116px;
  padding:13px 14px;
  border:1px solid rgba(49,215,255,.20);
  border-radius:13px;
  background:rgba(5,14,27,.62);
}

.fpsj-theme .fpsj-fps-tool-landing-hero__meta > span:last-child {
  border-color:rgba(140,99,255,.24);
}

.fpsj-theme .fpsj-fps-tool-landing-hero__meta strong {
  color:#f7faff;
  font-size:27px;
  line-height:.9;
}

.fpsj-theme .fpsj-fps-tool-landing-hero__meta small {
  padding-bottom:1px;
  color:#78dfff;
  font-size:9px;
  font-weight:850;
  letter-spacing:.12em;
}

.fpsj-theme .fpsj-fps-tool-landing-hero__meta > span:last-child small {
  color:#b69dff;
}

.fpsj-theme .fpsj-fps-tool-hub {
  display:grid;
  gap:24px;
}

.fpsj-theme .fpsj-fps-tool-hub__section {
  padding:22px 24px 24px;
  border-radius:18px;
  background:linear-gradient(180deg,rgba(8,19,35,.64),rgba(5,11,20,0));
}

.fpsj-theme .fpsj-fps-tool-hub__section-head {
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:20px;
  margin-bottom:16px;
}

.fpsj-theme .fpsj-fps-tool-hub__section-head span {
  display:block;
  margin-bottom:4px;
  color:#31d7ff;
  font-size:10px;
  font-weight:850;
  letter-spacing:.14em;
}

.fpsj-theme .fpsj-fps-tool-hub__section-head h2 {
  margin:0;
  color:#f7faff;
  font-size:22px;
  line-height:1.2;
}

.fpsj-theme .fpsj-fps-tool-hub__section-head > small {
  color:#7185a2;
  font-size:11px;
  font-weight:800;
  letter-spacing:.05em;
}

.fpsj-theme .fpsj-fps-tool-hub__generator-grid,
.fpsj-theme .fpsj-fps-tool-hub__showcase-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}

.fpsj-theme .fpsj-fps-tool-hub__utility-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
}

.fpsj-theme .fpsj-fps-tool-hub__generator-grid .fpsj-v3-tool-card {
  min-height:300px;
}

.fpsj-theme .fpsj-fps-tool-hub__generator-grid .fpsj-v3-tool-card__copy > strong {
  font-size:clamp(2rem,4vw,3rem);
}

.fpsj-theme .fpsj-fps-tool-hub__generator-grid .fpsj-v3-tool-card__copy p {
  max-width:31rem;
}

.fpsj-theme .fpsj-fps-tool-hub__showcase-grid .fpsj-tool-showcase {
  min-width:0;
}

.fpsj-theme .fpsj-fps-tool-hub__discover-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
}


.fpsj-theme .fpsj-fps-tool-utility-card {
  position:relative;
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:13px;
  min-width:0;
  min-height:138px;
  padding:18px;
  overflow:hidden;
  border:1px solid rgba(71,111,167,.28);
  border-radius:14px;
  background:
    radial-gradient(circle at 88% 12%,rgba(140,99,255,.09),transparent 34%),
    linear-gradient(145deg,#0a1729,#081321);
  color:#f7faff;
  text-decoration:none;
}

.fpsj-theme .fpsj-fps-tool-utility-card.is-available {
  transition:border-color .18s ease,transform .18s ease,background .18s ease;
}

.fpsj-theme .fpsj-fps-tool-utility-card.is-available:hover,
.fpsj-theme .fpsj-fps-tool-utility-card.is-available:focus-visible {
  transform:translateY(-2px);
  border-color:rgba(49,215,255,.48);
  background:
    radial-gradient(circle at 88% 12%,rgba(140,99,255,.14),transparent 36%),
    linear-gradient(145deg,#0c1b2f,#091624);
}

.fpsj-theme .fpsj-fps-tool-utility-card.is-planned {
  opacity:.62;
}

.fpsj-theme .fpsj-fps-tool-utility-card__mark {
  display:grid;
  place-items:center;
  width:48px;
  height:48px;
  border:1px solid rgba(49,215,255,.24);
  border-radius:12px;
  background:linear-gradient(145deg,rgba(52,120,255,.14),rgba(140,99,255,.10));
  color:#31d7ff;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:10px;
  font-weight:900;
  letter-spacing:.03em;
}

.fpsj-theme .fpsj-fps-tool-utility-card__copy {
  min-width:0;
}

.fpsj-theme .fpsj-fps-tool-utility-card__copy small {
  display:block;
  margin-bottom:4px;
  color:#7f93af;
  font-size:9px;
  font-weight:850;
  letter-spacing:.09em;
}

.fpsj-theme .fpsj-fps-tool-utility-card__copy strong {
  display:block;
  color:#f7faff;
  font-size:17px;
  line-height:1.25;
}

.fpsj-theme .fpsj-fps-tool-utility-card__copy p {
  margin:7px 0 0;
  color:#8195b1;
  font-size:11px;
  line-height:1.55;
}

.fpsj-theme .fpsj-fps-tool-utility-card > b {
  color:#31d7ff;
  font-size:16px;
}

.fpsj-theme .fpsj-fps-tool-utility-card__status {
  align-self:start;
  padding:6px 8px;
  border:1px solid rgba(140,99,255,.24);
  border-radius:999px;
  color:#b5a2ee;
  font-size:8px;
  font-weight:850;
  letter-spacing:.08em;
  white-space:nowrap;
}

.fpsj-theme .fpsj-fps-tool-discovery-card {
  position:relative;
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:12px;
  min-width:0;
  min-height:112px;
  padding:16px;
  overflow:hidden;
  border:1px solid rgba(71,111,167,.28);
  border-radius:13px;
  background:linear-gradient(145deg,#0a1729,#081321);
  color:#f7faff;
  text-decoration:none;
  transition:border-color .18s ease,transform .18s ease,background .18s ease;
}

.fpsj-theme .fpsj-fps-tool-discovery-card::before {
  content:"";
  position:absolute;
  inset:0 auto auto 0;
  width:100%;
  height:2px;
  background:linear-gradient(90deg,#31d7ff,#8c63ff 64%,transparent);
  opacity:.72;
}

.fpsj-theme .fpsj-fps-tool-discovery-card:hover,
.fpsj-theme .fpsj-fps-tool-discovery-card:focus-visible {
  transform:translateY(-2px);
  border-color:rgba(49,215,255,.46);
  background:linear-gradient(145deg,#0c1b2f,#091624);
}

.fpsj-theme .fpsj-fps-tool-discovery-card__mark {
  display:grid;
  place-items:center;
  width:42px;
  height:42px;
  border:1px solid rgba(49,215,255,.20);
  border-radius:10px;
  background:rgba(52,120,255,.11);
  color:#31d7ff;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:9px;
  font-weight:900;
  letter-spacing:.04em;
}

.fpsj-theme .fpsj-fps-tool-discovery-card__copy {
  min-width:0;
}

.fpsj-theme .fpsj-fps-tool-discovery-card__copy small {
  display:block;
  margin-bottom:3px;
  color:#768aa8;
  font-size:9px;
  font-weight:850;
  letter-spacing:.1em;
}

.fpsj-theme .fpsj-fps-tool-discovery-card__copy strong {
  display:block;
  color:#f7faff;
  font-size:15px;
  line-height:1.28;
}

.fpsj-theme .fpsj-fps-tool-discovery-card__copy p {
  margin:5px 0 0;
  color:#7f93af;
  font-size:11px;
  line-height:1.55;
}

.fpsj-theme .fpsj-fps-tool-discovery-card > b {
  color:#31d7ff;
  font-size:15px;
}

@media (max-width:760px) {
  .fpsj-theme .fpsj-fps-tool-landing-hero__row {
    grid-template-columns:1fr;
    align-items:start;
    gap:18px;
  }

  .fpsj-theme .fpsj-fps-tool-landing-hero__meta {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .fpsj-theme .fpsj-fps-tool-landing-hero__meta > span {
    min-width:0;
  }

  .fpsj-theme .fpsj-fps-tool-hub__generator-grid,
  .fpsj-theme .fpsj-fps-tool-hub__showcase-grid {
    grid-template-columns:minmax(0,1fr);
  }

  .fpsj-theme .fpsj-fps-tool-hub__utility-grid {
    grid-template-columns:minmax(0,1fr);
  }

  .fpsj-theme .fpsj-fps-tool-hub__generator-grid .fpsj-v3-tool-card {
    min-height:260px;
  }

  .fpsj-theme .fpsj-fps-tool-hub__discover-grid {
    grid-template-columns:minmax(0,1fr);
  }
}

@media (max-width:680px) {
  .fpsj-theme .fpsj-fps-tool-hub {
    gap:18px;
  }

  .fpsj-theme .fpsj-fps-tool-hub__section {
    padding:18px 0 20px;
    border-radius:0;
    background:transparent;
  }

  .fpsj-theme .fpsj-fps-tool-hub__section-head {
    align-items:start;
    margin-bottom:13px;
  }

  .fpsj-theme .fpsj-fps-tool-hub__section-head > small {
    display:none;
  }

  .fpsj-theme .fpsj-fps-tool-hub__section-head span,
  .fpsj-theme .fpsj-fps-tool-discovery-card__copy small {
    font-size:11px;
  }

  .fpsj-theme .fpsj-fps-tool-hub__section-head h2 {
    font-size:21px;
  }

  .fpsj-theme .fpsj-fps-tool-discovery-card {
    min-height:86px;
    padding:13px 14px;
  }

  .fpsj-theme .fpsj-fps-tool-discovery-card__copy strong {
    font-size:16px;
  }

  .fpsj-theme .fpsj-fps-tool-discovery-card__copy p {
    font-size:12px;
  }

  .fpsj-theme .fpsj-fps-tool-utility-card {
    min-height:96px;
    padding:14px;
  }

  .fpsj-theme .fpsj-fps-tool-utility-card__copy small {
    font-size:11px;
  }

  .fpsj-theme .fpsj-fps-tool-utility-card__copy strong {
    font-size:16px;
  }

  .fpsj-theme .fpsj-fps-tool-utility-card__copy p {
    font-size:12px;
  }

  .fpsj-theme .fpsj-fps-tool-utility-card__status {
    font-size:9px;
  }
}

@media (prefers-reduced-motion:reduce) {
  .fpsj-theme .fpsj-fps-tool-discovery-card,
  .fpsj-theme .fpsj-fps-tool-utility-card.is-available {
    transition:none;
  }
}


/* Theme Management foundation states / v0.4.140-beta */
.fpsj-v3-tool-card.is-disabled,
.fpsj-fps-tool-discovery-card.is-disabled {
  opacity:.58;
  cursor:not-allowed;
  pointer-events:none;
}

/* =========================================================
   FPS TOOL — horizontal creation-card media / 0.4.148
   Preserve complete owner artwork while giving each showcase
   a landscape-first card composition.
   ========================================================= */
.fpsj-theme .fpsj-fps-tool-hub__showcase-grid .fpsj-creations-track {
  padding-bottom:0;
}

.fpsj-theme .fpsj-fps-tool-hub__showcase-grid .fpsj-creation-card {
  flex:0 0 100%;
  width:100%;
  max-width:none;
  border-radius:12px;
}

.fpsj-theme .fpsj-fps-tool-hub__showcase-grid .fpsj-creation-card__media {
  aspect-ratio:16 / 9;
  background:
    radial-gradient(circle at 50% 42%,rgba(49,215,255,.08),transparent 68%),
    linear-gradient(145deg,#081523,#050b14);
}

.fpsj-theme .fpsj-fps-tool-hub__showcase-grid .fpsj-tool-showcase--skin .fpsj-creation-card__media {
  background:
    radial-gradient(circle at 50% 42%,rgba(140,99,255,.10),transparent 68%),
    linear-gradient(145deg,#0b1425,#050b14);
}

.fpsj-theme .fpsj-fps-tool-hub__showcase-grid .fpsj-creation-card__media img {
  object-fit:contain;
  object-position:center;
  transform:none;
}

/* =========================================================
   FPS TOOL — dedicated Generator card recomposition + Agent
   portrait stage / 0.4.149
   ========================================================= */

/* One wide Generator card per row gives the media enough width
   to be a true landscape frame instead of a tall side slot. */
.fpsj-theme .fpsj-fps-tool-hub__generator-grid {
  grid-template-columns:minmax(0,1fr);
  gap:16px;
}

.fpsj-theme .fpsj-fps-tool-hub__generator-grid .fpsj-v3-tool-card {
  grid-template-columns:minmax(0,.88fr) minmax(340px,1.12fr);
  align-items:center;
  gap:18px;
  min-height:260px;
  padding:18px;
}

.fpsj-theme .fpsj-fps-tool-hub__generator-grid .fpsj-v3-tool-card__copy {
  padding:4px 4px 4px 8px;
}

.fpsj-theme .fpsj-fps-tool-hub__generator-grid .fpsj-v3-tool-card__copy > strong {
  font-size:clamp(2.45rem,4.4vw,4rem);
  line-height:.9;
}

.fpsj-theme .fpsj-fps-tool-hub__generator-grid .fpsj-v3-tool-card__copy p {
  max-width:36rem;
}

.fpsj-theme .fpsj-fps-tool-hub__generator-grid .fpsj-v3-tool-card__media--image {
  width:100%;
  min-width:0;
  min-height:0;
  aspect-ratio:16/9;
  align-self:center;
  margin:0;
  overflow:hidden;
  box-sizing:border-box;
  border:1px solid rgba(72,116,177,.32);
  border-radius:12px;
  background:
    radial-gradient(circle at 50% 42%,rgba(49,215,255,.08),transparent 68%),
    linear-gradient(145deg,#081523,#050b14);
  box-shadow:0 14px 34px rgba(0,0,0,.20);
}

.fpsj-theme .fpsj-fps-tool-hub__generator-grid .fpsj-v3-tool-card--skin .fpsj-v3-tool-card__media--image {
  background:
    radial-gradient(circle at 50% 42%,rgba(140,99,255,.10),transparent 68%),
    linear-gradient(145deg,#0b1425,#050b14);
}

.fpsj-theme .fpsj-fps-tool-hub__generator-grid .fpsj-v3-tool-card__image {
  width:100%;
  height:100%;
  min-height:0;
  object-fit:contain;
  object-position:center;
  opacity:1;
  filter:saturate(.96) contrast(1.03);
  transform:none;
}

.fpsj-theme .fpsj-fps-tool-hub__generator-grid .fpsj-v3-tool-card:hover .fpsj-v3-tool-card__image {
  transform:none;
  opacity:1;
}

.fpsj-theme .fpsj-fps-tool-hub__generator-grid .fpsj-v3-tool-card__media--image::after {
  background:linear-gradient(180deg,rgba(5,11,20,.04),rgba(5,11,20,.14));
}

/* The Agent artwork remains portrait-oriented, but now sits inside
   an intentional independent 3:4 frame within the 16:9 stage. */
.fpsj-theme .fpsj-fps-tool-hub__showcase-grid .fpsj-tool-showcase--agent .fpsj-creation-card__media {
  display:grid;
  place-items:center;
  box-sizing:border-box;
  padding:12px;
  background:
    radial-gradient(circle at 50% 44%,rgba(49,215,255,.11),transparent 62%),
    linear-gradient(145deg,#081523,#050b14);
}

.fpsj-theme .fpsj-fps-tool-hub__showcase-grid .fpsj-tool-showcase--agent .fpsj-creation-card__media img {
  display:block;
  width:auto;
  max-width:52%;
  height:100%;
  max-height:100%;
  aspect-ratio:3/4;
  box-sizing:border-box;
  margin:0 auto;
  object-fit:contain;
  object-position:center;
  border:1px solid rgba(77,124,188,.36);
  border-radius:9px;
  background:#081321;
  box-shadow:0 14px 34px rgba(0,0,0,.25);
  transform:none;
}

@media (max-width:900px) {
  .fpsj-theme .fpsj-fps-tool-hub__generator-grid .fpsj-v3-tool-card {
    grid-template-columns:minmax(0,1fr) minmax(280px,.95fr);
  }
}

@media (max-width:680px) {
  .fpsj-theme .fpsj-fps-tool-hub__generator-grid .fpsj-v3-tool-card {
    grid-template-columns:minmax(0,1fr);
    gap:14px;
    min-height:0;
    padding:14px;
  }

  .fpsj-theme .fpsj-fps-tool-hub__generator-grid .fpsj-v3-tool-card__media {
    order:-1;
  }

  .fpsj-theme .fpsj-fps-tool-hub__generator-grid .fpsj-v3-tool-card__copy {
    padding:2px 3px 4px;
  }

  .fpsj-theme .fpsj-fps-tool-hub__generator-grid .fpsj-v3-tool-card__copy > strong {
    font-size:clamp(2rem,10vw,3rem);
  }

  .fpsj-theme .fpsj-fps-tool-hub__showcase-grid .fpsj-tool-showcase--agent .fpsj-creation-card__media {
    padding:9px;
  }

  .fpsj-theme .fpsj-fps-tool-hub__showcase-grid .fpsj-tool-showcase--agent .fpsj-creation-card__media img {
    max-width:58%;
    border-radius:7px;
  }
}

/* =========================================================
   FPS TOOL Agent portrait hard containment / 0.4.150
   Scope this final-cascade guard to the dedicated landing so
   Generator plugin image rules cannot restore vertical crop.
   ========================================================= */
.fpsj-theme .fpsj-fps-tool-hub__showcase-grid .fpsj-tool-showcase--agent .fpsj-creation-card__media {
  position:relative;
}

.fpsj-theme .fpsj-fps-tool-hub__showcase-grid .fpsj-tool-showcase--agent .fpsj-creation-card__media::before {
  content:"";
  position:absolute;
  z-index:0;
  top:12px;
  bottom:12px;
  left:50%;
  width:auto;
  max-width:calc(100% - 24px);
  aspect-ratio:3/4;
  box-sizing:border-box;
  border:1px solid rgba(77,124,188,.38);
  border-radius:9px;
  background:#081321;
  box-shadow:0 14px 34px rgba(0,0,0,.25);
  transform:translateX(-50%);
  pointer-events:none;
}

.fpsj-theme .fpsj-fps-tool-hub__showcase-grid .fpsj-tool-showcase--agent .fpsj-creation-card__media img {
  position:relative!important;
  z-index:1!important;
  display:block!important;
  width:auto!important;
  min-width:0!important;
  max-width:calc(100% - 26px)!important;
  height:calc(100% - 26px)!important;
  min-height:0!important;
  max-height:calc(100% - 26px)!important;
  aspect-ratio:auto!important;
  box-sizing:border-box!important;
  margin:auto!important;
  object-fit:contain!important;
  object-position:center!important;
  border:0!important;
  border-radius:7px!important;
  background:transparent!important;
  box-shadow:none!important;
  transform:none!important;
}

.fpsj-theme .fpsj-fps-tool-hub__showcase-grid .fpsj-tool-showcase--agent .fpsj-creation-card:hover .fpsj-creation-card__media img {
  transform:none!important;
}

@media (max-width:680px) {
  .fpsj-theme .fpsj-fps-tool-hub__showcase-grid .fpsj-tool-showcase--agent .fpsj-creation-card__media::before {
    top:9px;
    bottom:9px;
    max-width:calc(100% - 18px);
    border-radius:7px;
  }

  .fpsj-theme .fpsj-fps-tool-hub__showcase-grid .fpsj-tool-showcase--agent .fpsj-creation-card__media img {
    max-width:calc(100% - 20px)!important;
    height:calc(100% - 20px)!important;
    max-height:calc(100% - 20px)!important;
    border-radius:5px!important;
  }
}