.story-board {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, .95fr) minmax(0, .85fr);
  grid-template-rows: auto auto auto;
  column-gap: clamp(34px, 4.2vw, 76px);
  row-gap: 20px;
  align-items: center;
  padding: clamp(20px, 2.5vw, 40px);
  background: #f3f3f3;
}
.story-connectors {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  overflow: visible;
  pointer-events: none;
  fill: none;
  stroke: #777970;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.story-connectors marker path {fill:#777970;stroke:none}
.story-node {min-width:0;padding:16px;background:#ffffff}
.story-node header,.story-output header {margin-bottom:12px}
.story-node h3,.story-output h3 {font-size:20px;font-weight:400;line-height:1.3;letter-spacing:-.02em}
.story-node header p,.story-output header p {font-size:14px;line-height:1.65;margin-top:5px}
.story-generate {grid-column:1;grid-row:1}
.story-cast {grid-column:2;grid-row:1}
.story-products {grid-column:1 / 3;grid-row:2}
.story-store {grid-column:1 / 3;grid-row:3}
.story-output {grid-column:3;grid-row:1 / 4;min-width:0}
.story-images {display:grid;gap:7px}
.story-images figure {min-width:0}
.story-candidates {grid-template-columns:repeat(6,minmax(0,1fr))}
.story-cast-images,.story-product-images,.story-store-images {grid-template-columns:repeat(3,minmax(0,1fr))}
.story-image {width:100%;display:block;position:relative;padding:0;background:#fff;overflow:hidden}
.story-image img {width:100%;height:100%;object-fit:contain;transition:transform .3s var(--ease,ease)}
.story-candidates .story-image {aspect-ratio:3 / 4}
.story-cast-images .story-image {aspect-ratio:3 / 4}
.story-product-images .story-image {height:100px}
.story-store-images .story-image {height:110px;background:#f6f6f6}
.story-image-plus {position:absolute;right:4px;bottom:3px;width:20px;height:20px;display:grid;place-items:center;background:var(--paper,#ffffff);font-size:17px;opacity:0;transition:opacity .2s}
.story-image:hover img {transform:scale(1.025)}
.story-image:hover .story-image-plus,.story-image:focus-visible .story-image-plus {opacity:1}
.story-images figcaption {font-size:12px;line-height:1.4;padding-top:5px}
.story-output video {display:block;width:100%;height:auto;aspect-ratio:9 / 16;object-fit:contain;background:#242521}
.story-film-meta {display:flex;justify-content:space-between;gap:16px;font-size:13px;line-height:1.5;margin-top:10px}
.story-film-meta a {text-decoration:underline;text-underline-offset:3px}
.story-section .story-hint {font-size:13px;line-height:1.7;margin-top:12px;color:var(--muted,#686861)}
@media (min-width: 961px) {
  .story-products,.story-store {display:grid;grid-template-columns:150px minmax(0,1fr);gap:20px;align-items:center}
  .story-products header,.story-store header {margin-bottom:0}
}
@media (max-width: 1100px) and (min-width: 961px) {
  .story-candidates {grid-template-columns:repeat(4,minmax(0,1fr))}
  .story-node {padding:12px}
  .story-node h3,.story-output h3 {font-size:18px}
  .story-node header p,.story-output header p {font-size:13px}
}
@media (max-width: 960px) {
  .story-board {display:flex;flex-direction:column;align-items:stretch;gap:26px;padding:20px 34px 20px 20px}
  .story-node {padding:16px}
  .story-generate,.story-cast,.story-products,.story-store,.story-output {width:100%}
  .story-candidates {grid-template-columns:repeat(6,minmax(0,1fr))}
  .story-cast-images {max-width:420px}
  .story-cast-images .story-image {aspect-ratio:3 / 4}
  .story-product-images .story-image,.story-store-images .story-image {height:140px}
  .story-output {padding:16px;background:#ffffff}
  .story-output video {max-height:650px}
}
@media (max-width: 560px) {
  .story-board {padding:16px 30px 16px 14px;gap:28px}
  .story-node,.story-output {padding:12px}
  .story-candidates {grid-template-columns:repeat(4,minmax(0,1fr))}
  .story-node h3,.story-output h3 {font-size:20px}
  .story-node header p,.story-output header p {font-size:14px}
  .story-images {gap:5px}
  .story-product-images .story-image,.story-store-images .story-image {height:84px}
  .story-images figcaption {font-size:11px}
  .story-film-meta {font-size:12px;gap:10px}
  .story-output video {max-height:none}
}
