/* vs-ai-gateways-and-routers deck */
.fc { margin-top: 8px; display: grid; gap: 14px; }
.fc-lane { background: var(--bg-surface); border: 1px solid var(--border-subtle); border-radius: var(--radius-md); padding: 16px 18px; }
.fc-lane.neo { border-color: var(--border-highlight); background: var(--bg-surface-elevated); box-shadow: var(--glow-subtle); }
.fc-lane h3 { font-size: 1rem; margin-bottom: 12px; } .fc-lane h3 small { font-weight: 420; color: var(--text-muted); font-size: .8125rem; margin-left: 8px; }
.fc-row { display: flex; align-items: stretch; gap: 8px; }
.fc-node { display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; gap: 3px; padding: 10px 14px; border: 1px solid var(--border-medium); border-radius: var(--radius-sm); background: var(--bg-page); font-size: .875rem; font-weight: 600; color: var(--text-primary); min-width: 84px; }
.fc-node small { font-weight: 420; color: var(--text-muted); font-size: .75rem; }
.fc-node.dec { border-color: var(--border-highlight); flex: 1 1 0; }
.fc-node.out { flex: 1 1 0; border-style: dashed; }
.fc-arr { align-self: center; position: relative; width: 36px; height: 2px; background: var(--border-medium); flex: none; }
.fc-arr::after { content: ""; position: absolute; right: -1px; top: -3px; border: 4px solid transparent; border-left: 6px solid var(--border-medium); }
.fc-arr .pk { position: absolute; top: -3px; left: 0; width: 8px; height: 8px; border-radius: 50%; background: var(--blue-glow); opacity: 0; }
.fc.run .fc-arr .pk { animation: fc-pk 1.4s var(--ease) infinite; }
.fc.run .fc-lane.neo .fc-arr .pk { background: var(--cyan-glow); }
@keyframes fc-pk { 0% { left: 0; opacity: 0; } 15% { opacity: 1; } 85% { opacity: 1; } 100% { left: 28px; opacity: 0; } }
.fc-steps { display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; margin-top: 12px; }
.fc-step { display: flex; flex-direction: column; gap: 6px; align-items: flex-start; padding: 9px 10px; border-radius: var(--radius-sm); border: 1px solid var(--border-medium); background: var(--bg-page); font-size: .8125rem; font-weight: 600; transition: opacity .4s, transform .4s var(--ease), border-color .4s; }
.fc-step b { font-family: var(--font-display); color: var(--blue-glow); margin-right: 6px; }
.fc.anim .fc-step:not(.go) { opacity: .22; transform: translateY(6px); }
.fc-step.go[data-t="s"] { border-color: rgba(0, 245, 160, .45); } .fc-step.go[data-t="m"] { border-color: rgba(56, 189, 248, .5); } .fc-step.go[data-t="f"] { border-color: rgba(251, 191, 36, .5); }
.mini { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 12px; }
.fit-cards { margin-top: 18px; }
.fit-arch .arr { animation: fit-pulse 2.4s ease-in-out infinite; } .fit-arch .arr:nth-of-type(2) { animation-delay: .5s; } .fit-arch .arr:nth-of-type(3) { animation-delay: 1s; }
@keyframes fit-pulse { 0%, 100% { color: var(--text-muted); } 50% { color: var(--cyan-glow); } }
.sg-zones { display: grid; grid-template-columns: 1fr 2fr 1fr; gap: 4px; margin: 4px 0 14px; font-size: .75rem; text-align: center; }
.sg-zones span { padding: 5px 4px; border-radius: 6px; background: var(--bg-surface); border: 1px solid var(--border-subtle); color: var(--text-muted); transition: border-color .3s, color .3s, background .3s; }
.sg-zones span.on { color: var(--text-primary); border-color: var(--border-highlight); background: rgba(56, 189, 248, .08); }
.sg-out .sg-text { margin: 10px 0; font-size: var(--t-small); color: var(--text-secondary); }
.sg-link { font-weight: 650; }
@media (max-width: 899px) {
  .fc { gap: 8px; } .fc-lane { padding: 10px 12px; } .fc-lane h3 { font-size: .875rem; margin-bottom: 8px; } .fc-lane h3 small { display: block; margin: 0; font-size: .75rem; }
  .fc-node { padding: 6px 8px; font-size: .75rem; min-width: 0; } .fc-node small { font-size: .625rem; }
  .fc-arr { width: 16px; } @keyframes fc-pk { 0% { left: 0; opacity: 0; } 15% { opacity: 1; } 85% { opacity: 1; } 100% { left: 8px; opacity: 0; } }
  .fc-lane.neo .fc-node.out { display: none; } .fc-lane.neo .fc-arr.nx { display: none; }
  .fc-steps { gap: 4px; margin-top: 8px; } .fc-step { padding: 5px 5px; font-size: .6875rem; gap: 3px; } .fc-step .chip { font-size: .625rem; padding: 1px 4px; }
  .mini { margin-top: 6px; } .mini .chip { font-size: .6875rem; padding: 1px 6px; }
  .fit-cards { margin-top: 8px; }
  .sg-zones { font-size: .625rem; margin-bottom: 6px; } .sg-out .sg-text { margin: 6px 0; font-size: .8125rem; }
  #need .section-lead { display: none; } #blind .card p { display: none; }
  #table table.t td, #table table.t th { font-size: .6875rem; padding: 4px 5px; } #table table.t caption { font-size: .6875rem; }
}
#flow h2 { max-width: 34ch; font-size: clamp(1.75rem, 1rem + 2.2vw, 2.5rem); margin-bottom: 14px; }
@media (max-width: 899px) { #flow h2 { font-size: clamp(1.4rem, 6.3vw, 1.7rem); } }