.demo-guide-nav { border-color: rgba(245, 190, 67, .72); background: rgba(245, 190, 67, .1); }
.demo-guide-nav .nav-group::before { background: #f5be43; }
.demo-guide-toolbar { position: fixed; right: 18px; bottom: 18px; z-index: 9990; display: flex; align-items: center; gap: 14px; max-width: min(680px, calc(100vw - 36px)); padding: 11px 13px; border: 1px solid #91bcd8; border-radius: 14px; color: #102f49; background: #f7fbfe; box-shadow: 0 15px 42px rgba(8, 39, 62, .22); }
.demo-guide-toolbar span { min-width: 0; font-size: .84rem; overflow-wrap: anywhere; }
.demo-guide-toolbar .button-row { flex: 0 0 auto; margin: 0; }
.demo-guide-active { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 18px; border-left: 5px solid var(--blue); }
.demo-guide-active h2, .demo-guide-card h2 { margin: 3px 0 8px; }
.demo-guide-catalog { align-items: stretch; }
.demo-guide-card { display: flex; flex-direction: column; align-items: flex-start; cursor: default; }
.demo-guide-card p { flex: 1 1 auto; }
.demo-guide-card form { width: 100%; margin-top: 12px; }
.demo-guide-card .button { width: 100%; }
.mattheis-demo-guide.driver-popover { max-width: min(410px, calc(100vw - 28px)); border: 1px solid #7fb1d2; border-radius: 15px; color: #102f49; background: #fff; box-shadow: 0 20px 55px rgba(8, 39, 62, .27); }
.mattheis-demo-guide .driver-popover-title { color: #0b3d64; font: 850 1.02rem/1.25 "Segoe UI", sans-serif; }
.mattheis-demo-guide .driver-popover-description { color: #314d62; font: .9rem/1.5 "Segoe UI", sans-serif; }
.mattheis-demo-guide .driver-popover-progress-text { color: #5b7182; }
.mattheis-demo-guide .driver-popover-footer button { border: 1px solid #0d669e; border-radius: 8px; color: #fff; background: #0d669e; text-shadow: none; }
.mattheis-demo-guide .driver-popover-footer .driver-popover-prev-btn { color: #0d527e; background: #fff; }
.mattheis-demo-guide .driver-popover-close-btn { color: #35566c; }

@media (max-width: 700px) {
  .demo-guide-toolbar { left: 12px; right: 12px; bottom: 12px; align-items: stretch; flex-direction: column; }
  .demo-guide-toolbar .button-row { width: 100%; }
  .demo-guide-toolbar .button { flex: 1 1 auto; }
  .demo-guide-active { align-items: stretch; flex-direction: column; }
}
