.onboarding-tour {
    position: fixed;
    inset: 0;
    z-index: 1000;
    pointer-events: none;
    color: #292438;
    font-family: inherit;
}
.tour-shade { position: fixed; background: rgba(39, 24, 66, .22); }
.tour-highlight {
    position: fixed;
    border: 2px solid #7c3aed;
    border-radius: 12px;
    box-shadow: 0 2px 12px rgba(109, 40, 217, .38);
}
.tour-card {
    position: fixed;
    visibility: hidden;
    padding: 22px;
    border: 1px solid #aa82df;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 12px 32px rgba(40, 24, 67, .2);
    pointer-events: auto;
    overflow-y: auto;
    overscroll-behavior: contain;
    outline: none;
    line-height: 1.6;
}
.tour-progress { color: #6a429e; font-size: 13px; font-weight: 600; margin: 0 0 9px; }
.tour-card h2 { color: #292438; font-size: 22px; line-height: 1.4; margin: 0 0 12px; }
#tour-description { color: #595066; font-size: 15px; margin: 0; }
.tour-controls { display: flex; gap: 10px; align-items: center; border-top: 1px solid #e8dfef; margin-top: 20px; padding-top: 16px; }
.tour-controls button { font: inherit; font-size: 14px; min-height: 44px; border-radius: 9px; cursor: pointer; }
.tour-previous { padding: 8px 12px; border: 1px solid #8d62c1; background: #fff; color: #6a429e; }
.tour-next { padding: 8px 15px; border: 1px solid transparent; background: #65439b; color: #fff; font-weight: 600 !important; }
.tour-controls span { font-size: 22px; line-height: 1; vertical-align: -1px; }
.tour-skip { margin-left: auto; padding: 8px; color: #6a429e; background: transparent; border: 0; }
.tour-controls button:hover { filter: brightness(.95); }
.tour-controls button:disabled { opacity: .4; cursor: default; }
.tour-controls button:focus-visible { outline: 3px solid #7c3aed; outline-offset: 3px; }
.tour-pointer { position: fixed; width: 16px; height: 16px; transform: rotate(45deg); background: #fff; border-top: 1px solid #aa82df; border-left: 1px solid #aa82df; }
.tour-pointer-down { border-top: 0; border-left: 0; border-bottom: 1px solid #aa82df; border-right: 1px solid #aa82df; }
@media (max-width: 600px) {
    .tour-open #account-panel { padding-bottom: var(--tour-reserve, 320px); }
    .tour-card { padding: 18px 20px; }
    .tour-card h2 { font-size: 20px; margin-bottom: 8px; }
    #tour-description { font-size: 14px; }
    .tour-controls { margin-top: 14px; padding-top: 12px; }
}
@media (prefers-reduced-motion: reduce) { .onboarding-tour * { scroll-behavior: auto; } }