.onboarding-dialog {
    position: fixed; inset: 0; margin: 0; padding: 0;
    width: 100%; height: 100%; max-width: none; max-height: none;
    border: 0; background: transparent; overflow: hidden;
    color: var(--color-dark-green, #153f28);
}
.onboarding-dialog::backdrop { background: transparent; }
.onboarding-target { scroll-margin-top: 14px; }
.onboarding-spotlight {
    position: fixed; border: 2px solid #fff; border-radius: 16px;
    box-shadow: 0 0 0 200vmax rgba(11, 30, 21, .64);
    pointer-events: none; box-sizing: border-box;
}
.onboarding-dialog.onboarding-no-target { background: rgba(11, 30, 21, .64); }
.onboarding-panel {
    position: fixed; box-sizing: border-box; margin: 0;
    background: #fff; border: 1px solid #d9e8df; border-radius: 20px;
    padding: 18px; box-shadow: 0 12px 40px rgba(8, 30, 18, .2);
    max-height: calc(100dvh - 24px); overflow: auto;
}
.onboarding-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.onboarding-count { font-size: 13px; color: #5d7167; }
.onboarding-skip { border: 0; background: transparent; color: #375e48; min-height: 44px; padding: 8px; font: inherit; font-size: 14px; cursor: pointer; }
.onboarding-panel h2 { font-size: 22px; line-height: 1.2; margin: 2px 0 10px; }
.onboarding-panel p { font-size: 15px; line-height: 1.45; margin: 0 0 16px; color: #374c40; }
.onboarding-actions { display: flex; gap: 10px; }
.onboarding-actions .btn { min-height: 44px; flex: 1; width: auto; }
.onboarding-actions .btn:disabled { opacity: .45; }
.onboarding-panel button:focus-visible { outline: 3px solid #25834e; outline-offset: 3px; }
@media (max-height: 500px) {
    .onboarding-panel { padding: 12px 16px; }
    .onboarding-panel h2 { font-size: 19px; }
    .onboarding-panel p { font-size: 14px; margin-bottom: 10px; }
}
