/* Ailex 1.5.1 begeleiding (gids.js): kaartje met uitleg + "Stel je voor" en een bewegend pijltje naar de knop.
   De laag laat tikken door (pointer-events: none), alleen het kaartje vangt tikken; zo kun je meteen op de knop zelf tikken. */
.gids-laag { position: fixed; inset: 0; z-index: 9000; pointer-events: none; }
.gids-laag[hidden] { display: none; }
.gids-laag.welkom { background: rgba(20, 22, 60, .45); pointer-events: auto; display: flex; align-items: center; justify-content: center; padding: 16px; }
.gids-kaart { position: fixed; pointer-events: auto; background: #fff; color: #1D1E3A; border-radius: 18px; padding: 12px 14px;
  box-shadow: 0 4px 0 rgba(40, 44, 110, .25), 0 10px 28px rgba(20, 22, 60, .25); font: 500 15px/1.4 var(--sg-letter, system-ui, sans-serif); }
.gids-laag.welkom .gids-kaart { position: relative; max-width: 360px; left: auto !important; top: auto !important; }
.gids-kaart b { display: block; font-size: 16px; font-weight: 800; margin-bottom: 4px; }
.gids-kaart p { margin: 0 0 6px; }
.gids-stel { background: #FFF4CC; color: #4A3A00; border-radius: 12px; padding: 6px 10px; font-style: italic; }
.gids-knoppen { display: flex; gap: 8px; margin-top: 8px; flex-wrap: wrap; }
.gids-knoppen button { min-height: 44px; padding: 0 14px; border: 0; border-radius: 22px; font: 700 15px var(--sg-letter, system-ui, sans-serif); cursor: pointer; }
.gids-ok { background: #4453E0; color: #fff; }
.gids-weg { background: #ECEDF8; color: #2A2C5A; }
.gids-pijl { position: fixed; width: 40px; height: 48px; pointer-events: none; animation: gids-hup .9s ease-in-out infinite; }
.gids-pijl[hidden] { display: none; }
.gids-pijl svg { width: 100%; height: 100%; fill: #FF8A00; stroke: #fff; stroke-width: 2.5; filter: drop-shadow(0 3px 2px rgba(0, 0, 0, .25)); }
.gids-pijl.omhoog svg { transform: rotate(180deg); }
.gids-pijl.omhoog { animation-name: gids-hup-op; }
@keyframes gids-hup { 0%, 100% { transform: translateY(-8px); } 50% { transform: translateY(2px); } }
@keyframes gids-hup-op { 0%, 100% { transform: translateY(8px); } 50% { transform: translateY(-2px); } }
@media (prefers-reduced-motion: reduce) { .gids-pijl { animation-duration: 2.4s; } }
a.ailex-link { color: #2F3DC4; text-decoration: underline; word-break: break-all; }
.msg.alex a.ailex-link { color: #fff; }