/* A change of direction has one shared color and a short, staggered entrance. */
@property --idea-color {syntax:'<color>';inherits:true;initial-value:#b5a0ff}
.idea-builder{transition:--idea-color .8s cubic-bezier(.22,1,.36,1)}
.idea-scene{display:grid;height:365px;min-height:365px;align-items:center;isolation:isolate}
.idea-scene>div{grid-area:1/1;width:100%;min-width:0;animation:none}
.idea-scene>.scene-entering{animation:idea-scene-arrive .6s cubic-bezier(.22,1,.36,1) both}
.idea-scene>.scene-leaving{pointer-events:none;animation:idea-scene-out .24s ease-in both}
.scene-entering .idea-piece{animation:idea-piece-arrive .65s cubic-bezier(.22,1,.36,1) var(--piece-delay,70ms) both}
.scene-entering .flow-node{animation:idea-node-arrive .75s cubic-bezier(.22,1,.36,1) .18s both}
.scene-entering .flow-hub{animation-delay:.27s}.scene-entering .flow-output{animation-delay:.36s}
.scene-entering .idea-thought{animation:idea-node-arrive .75s cubic-bezier(.22,1,.36,1) .2s both}
.scene-entering .thought-two{animation-delay:.28s}.scene-entering .thought-three{animation-delay:.36s}
.idea-word-enter{display:inline-block;animation:idea-word-arrive .6s cubic-bezier(.22,1,.36,1) both}
@keyframes idea-scene-out{to{opacity:0;filter:blur(5px);transform:translateX(calc(var(--idea-direction,1)*-18px)) scale(.97)}}
@keyframes idea-scene-arrive{from{opacity:0;filter:blur(5px);transform:translateX(calc(var(--idea-direction,1)*24px)) scale(.97)}to{opacity:1;filter:blur(0);transform:translateX(0) scale(1)}}
@keyframes idea-piece-arrive{from{opacity:0;translate:0 14px}to{opacity:1;translate:0 0}}
@keyframes idea-node-arrive{from{opacity:0;scale:.84;translate:0 12px}to{opacity:1;scale:1;translate:0 0}}
@keyframes idea-word-arrive{from{opacity:.2;filter:blur(4px);translate:0 9px}to{opacity:1;filter:blur(0);translate:0 0}}


@media(max-width:700px){.idea-scene{height:350px;min-height:350px}}
@media(prefers-reduced-motion:reduce){.idea-builder{transition:none}.idea-scene>.scene-entering,.scene-entering .idea-piece,.scene-entering .flow-node,.scene-entering .idea-thought,.idea-word-enter{animation:none}.idea-scene>.scene-leaving{display:none}}
.paused .idea-builder{transition:none}
