/* The existing panel, copy, tabs and media retain their layout. */
#guidegrip-flow .flow-footer {
  align-items: center;
  justify-content: flex-end;
  gap: 16px;
}
#guidegrip-flow .flow-navigation {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  max-width: 100%;
}
#guidegrip-flow :is(.flow-next, .flow-previous) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  flex: 0 1 auto;
  min-width: 0;
  min-height: 44px;
  padding: 11px 17px;
  border: 1px solid #ff914f;
  border-radius: 5px;
  background: #ff914f;
  color: #1d232a;
  font: inherit;
  font-size: .88rem;
  font-weight: 600;
  line-height: 1.4;
  cursor: pointer;
  transition: background-color .15s, border-color .15s;
}
#guidegrip-flow .flow-next:hover {
  background: #ffa36b;
  border-color: #ffa36b;
}
#guidegrip-flow :is(.flow-next, .flow-previous):focus-visible {
  outline: 3px solid #ffb58b;
  outline-offset: 4px;
}
#guidegrip-flow .flow-previous {
  background: transparent;
  border-color: #677780;
  color: #c3cdd3;
}
#guidegrip-flow .flow-previous:not(:disabled):hover {
  background: #2a343c;
  border-color: #9aa9b1;
}
#guidegrip-flow :is(.flow-next, .flow-previous) > [aria-hidden] { flex: none; }
#guidegrip-flow :is(.flow-next, .flow-previous):disabled { opacity: .45; cursor: default; }
@media (max-width: 520px) {
  #guidegrip-flow .flow-footer { gap: 12px; }
  #guidegrip-flow .flow-navigation { gap: 10px; }
  #guidegrip-flow :is(.flow-next, .flow-previous) { padding-inline: 12px; font-size: .82rem; gap: 8px; }
}
@media (prefers-reduced-motion: reduce) {
  #guidegrip-flow :is(.flow-next, .flow-previous) { transition: none; }
}