/* Small version thumbnails integrated into the existing hero artwork. */
.fp-stage { position:relative; }
.fp-poster-strip {
  position:absolute; top:22px; right:24px; z-index:2;
  display:flex; align-items:end; gap:12px; padding:12px 13px 10px;
  border:1px solid rgb(255 255 255 / .12); border-radius:10px;
  background:rgb(8 11 16 / .7); backdrop-filter:blur(14px);
}
.fp-poster-card {
  position:relative; width:46px; padding:0; border:0; color:#c0c6cf;
  background:none; text-align:left; isolation:isolate;
}
.fp-poster-frame {
  display:flex; align-items:center; justify-content:center; width:100%; height:68px;
  transform-origin:center bottom; transition:transform 220ms cubic-bezier(.2,.75,.3,1);
}
.fp-poster-frame img {
  display:block; width:auto; height:auto; max-width:100%; max-height:100%; object-fit:contain;
  border:1px solid #4a4b50; border-radius:3px; box-shadow:0 5px 15px #0006;
  transition:border-color 180ms,box-shadow 180ms;
}
.fp-poster-version { display:block; margin-top:7px; text-align:center; font-size:10px; font-weight:500; line-height:1.4; }
.fp-poster-version>span { display:none; }
.fp-poster-card:focus-visible { z-index:5; outline:0; }
.fp-poster-card:focus-visible .fp-poster-frame { transform:translateY(-4px) scale(2.2); }
.fp-poster-card:focus-visible img { outline:2px solid var(--fp-accent); outline-offset:4px; }
@media(hover:hover) and (pointer:fine) {
  .fp-poster-card:hover { z-index:5; color:#fff1e8; }
  .fp-poster-card:hover .fp-poster-frame { transform:translateY(-4px) scale(2.2); }
  .fp-poster-card:hover img { border-color:#dda98c; box-shadow:0 12px 32px #000b; }
  .fp-poster-card:hover .fp-poster-version>span { color:var(--fp-accent); }
}
.fp-site.fp-poster-open { overflow:hidden; }
.fp-poster-dialog {
  width:min(1000px,calc(100vw - 48px)); height:calc(100dvh - 48px);
  max-width:none; max-height:none; margin:auto; padding:0;
  color:var(--fp-text); background:transparent; border:0; overflow:visible;
}
.fp-poster-dialog[open] { display:grid; grid-template-rows:auto minmax(0,1fr) auto; gap:14px; }
.fp-poster-dialog::backdrop { background:rgb(4 6 9 / .92); backdrop-filter:blur(12px); }
.fp-poster-toolbar { display:flex; align-items:center; justify-content:space-between; gap:20px; }
.fp-poster-toolbar h2 { font-size:17px; font-weight:600; letter-spacing:-.025em; line-height:1.5; }
.fp-poster-toolbar [data-poster-development] { display:block; margin-top:2px; color:#e2b094; font-size:10px; }
.fp-poster-stage { min-width:0; min-height:0; display:flex; justify-content:center; align-items:center; }
.fp-poster-stage img { width:100%; height:100%; object-fit:contain; min-height:0; filter:drop-shadow(0 10px 30px #0008); }
.fp-poster-controls { display:flex; justify-content:center; align-items:center; gap:25px; }
.fp-site .fp-poster-control {
  width:44px; height:44px; padding:11px; display:grid; place-items:center;
  border:1px solid #414650; border-radius:50%; background:#1b1e25; color:#e4e6eb;
}
.fp-poster-control svg { width:20px; height:20px; stroke:currentColor; stroke-width:1.65; fill:none; }
.fp-site .fp-poster-control:hover { border-color:#dca38a; color:#ffc4a8; background:#29252a; }
.fp-poster-position { min-width:62px; text-align:center; font-size:12px; letter-spacing:.08em; color:#b9c0cb; font-variant-numeric:tabular-nums; }
@media(max-width:760px) {
  .fp-poster-strip { position:static; width:max-content; margin:14px auto 0; padding:0; gap:16px; background:none; border-color:transparent; backdrop-filter:none; }
  .fp-poster-card { width:44px; }
  .fp-poster-frame { height:54px; }
  .fp-poster-version { margin-top:6px; font-size:9px; }
  .fp-poster-dialog { width:calc(100vw - 24px); height:calc(100dvh - 24px); }
  .fp-poster-dialog[open] { gap:10px; }
  .fp-poster-toolbar { padding-inline:5px; }
  .fp-poster-toolbar h2 { font-size:15px; }
}
@media(prefers-reduced-motion:reduce) {
  .fp-poster-frame,.fp-poster-frame img { transition:none; }
}
