/* Radahost preview badge + guided tour. Loaded only when PREVIEW is true. */
.pv { --rh: #4f1fd6; --rh-soft: #efeafd; position: fixed; left: 18px; bottom: 24px; z-index: 70; font-family: var(--sans); }
.pv-pill {
  display: inline-flex; align-items: center; gap: 10px; padding: 10px 16px 10px 12px; border: 0; border-radius: 999px; cursor: pointer;
  background: #fff; color: var(--ink); font-size: 13px; box-shadow: 0 6px 22px rgba(0, 0, 0, .18);
}
.pv-pill strong { color: var(--rh); font-weight: 500; }
.pv-dot { width: 9px; height: 9px; border-radius: 50%; background: var(--rh); box-shadow: 0 0 0 0 rgba(79, 31, 214, .5); animation: pv-pulse 2s infinite; }
@keyframes pv-pulse { 70% { box-shadow: 0 0 0 9px rgba(79, 31, 214, 0); } 100% { box-shadow: 0 0 0 0 rgba(79, 31, 214, 0); } }
.pv-panel {
  position: absolute; left: 0; bottom: calc(100% + 12px); width: min(360px, calc(100vw - 36px));
  background: #fff; color: var(--text); padding: 24px 24px 20px; box-shadow: 0 18px 50px rgba(0, 0, 0, .25); border-top: 3px solid var(--rh);
}
.pv-panel h3 { font-size: 22px; margin: 6px 0 10px; }
.pv-panel p { font-size: 14px; color: var(--muted); margin-bottom: 18px; }
.pv-kicker { font-size: 10.5px; letter-spacing: .2em; text-transform: uppercase; color: var(--rh); }
.pv-x { position: absolute; top: 8px; right: 10px; border: 0; background: none; font-size: 22px; line-height: 1; cursor: pointer; color: var(--muted); padding: 4px; }
.pv-actions { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.pv-btn {
  border: 0; cursor: pointer; background: var(--rh); color: #fff; padding: 11px 16px; font-size: 12px; letter-spacing: .12em; text-transform: uppercase; font-weight: 500;
}
.pv-btn:hover { background: #3d14b3; }
.pv-btn.ghost { background: transparent; color: var(--ink); border: 1px solid var(--line); }
.pv-link { font-size: 13px; color: var(--rh); }
.pv-link:hover { text-decoration: underline; }

/* Tour */
.pv-spot {
  position: fixed; z-index: 90; pointer-events: none; border-radius: 4px;
  box-shadow: 0 0 0 3px var(--rh, #4f1fd6), 0 0 0 9999px rgba(10, 14, 12, .62);
  transition: top .35s, left .35s, width .35s, height .35s;
}
.pv-spot.none { box-shadow: 0 0 0 9999px rgba(10, 14, 12, .62); width: 0 !important; height: 0 !important; }
.pv-card {
  --rh: #4f1fd6; position: fixed; z-index: 91; left: 50%; transform: translateX(-50%); width: min(440px, calc(100vw - 32px));
  background: #fff; padding: 22px 24px 18px; box-shadow: 0 18px 50px rgba(0, 0, 0, .35); border-top: 3px solid var(--rh); font-family: var(--sans);
}
.pv-card.bottom { bottom: 20px; }
.pv-card.top { top: 20px; }
.pv-card.center { top: 50%; transform: translate(-50%, -50%); }
.pv-card .pv-kicker { display: flex; justify-content: space-between; }
.pv-card h3 { font-size: 22px; margin: 8px 0 8px; }
.pv-card p { font-size: 14.5px; color: var(--muted); margin: 0 0 16px; }
.pv-card .pv-nav { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.pv-card .pv-skip { border: 0; background: none; color: var(--muted); font-size: 13px; cursor: pointer; padding: 0; }
.pv-card .pv-sign { font-size: 11.5px; color: var(--muted); margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--cream-2); }
.pv-card .pv-sign a { color: var(--rh); }

@media (max-width: 680px) {
  .pv { left: 12px; bottom: 18px; }
  .pv-pill { padding: 9px 14px 9px 11px; font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) { .pv-dot { animation: none; } .pv-spot { transition: none; } }
.pv-card .pv-btn:focus:not(:focus-visible), .pv-card .pv-skip:focus:not(:focus-visible) { outline: none; }