.onboarding-card{margin:0 0 18px;padding:16px 16px 12px;border:1px solid color-mix(in srgb,var(--app-accent) 45%,transparent);border-radius:16px;background:var(--app-surface);color:var(--app-text)}.onboarding-card-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px}.onboarding-card-head h2{margin:0;font-size:var(--font-body, 1rem);font-weight:700}.onboarding-card-count{color:var(--app-muted);font-size:var(--font-small, .875rem)}.onboarding-card-bar{height:5px;margin:10px 0 6px;overflow:hidden;border-radius:999px;background:color-mix(in srgb,var(--app-muted) 18%,transparent)}.onboarding-card-bar span{display:block;height:100%;border-radius:inherit;background:var(--app-accent)}.onboarding-steps{margin:0;padding:0;list-style:none}.onboarding-step{display:flex;align-items:center;gap:12px;min-height:48px;padding:6px 0}.onboarding-step-mark{display:grid;flex:0 0 auto;width:22px;height:22px;place-items:center;border:2px solid color-mix(in srgb,var(--app-muted) 40%,transparent);border-radius:50%;font-size:.8rem}.onboarding-step.is-current .onboarding-step-mark{border-color:var(--app-accent)}.onboarding-step.is-done .onboarding-step-mark{border-color:var(--app-success);background:var(--app-success);color:var(--app-bg)}.onboarding-step-copy{display:grid;flex:1 1 auto;min-width:0;gap:2px}.onboarding-step-label{font-size:var(--font-small, .9375rem)}.onboarding-step.is-current .onboarding-step-label{font-weight:700}.onboarding-step.is-done .onboarding-step-label{color:var(--app-subtle);text-decoration:line-through}.onboarding-step-copy small{color:var(--app-muted);font-size:var(--font-caption, .8125rem)}.onboarding-step-action{flex:0 0 auto;min-width:64px;padding:9px 16px;border-radius:999px;background:var(--app-accent);color:var(--app-bg);font-size:var(--font-small, .875rem);font-weight:700;text-align:center;text-decoration:none}.onboarding-step-action:hover,.onboarding-step-action:focus-visible{background:color-mix(in srgb,var(--app-accent) 85%,var(--app-text));color:var(--app-bg)}.onboarding-card-hide{margin:2px 0 0}.onboarding-card-hide button{min-height:36px;padding:0;border:0;background:none;color:var(--app-subtle);font-size:var(--font-caption, .8125rem);cursor:pointer}.onboarding-card-hide button:hover,.onboarding-card-hide button:focus-visible{color:var(--app-text)}.onboarding-visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.onboarding-tip{position:fixed;z-index:1150;display:grid;gap:4px;width:min(264px,calc(100vw - 32px));padding:12px 14px 10px;border:1px solid var(--app-accent);border-radius:12px;background:var(--app-surface-raised, var(--app-surface));color:var(--app-text);box-shadow:0 10px 28px color-mix(in srgb,var(--app-bg) 70%,transparent)}.onboarding-tip[hidden]{display:none}.onboarding-tip-head{display:flex;align-items:baseline;justify-content:space-between;gap:8px}.onboarding-tip strong{line-height:1.35;font-size:var(--font-small, .9375rem)}.onboarding-tip-count{flex:0 0 auto;color:var(--app-subtle);font-size:var(--font-caption, .75rem)}.onboarding-tip-text{line-height:1.4;color:var(--app-muted);font-size:var(--font-caption, .8125rem)}.onboarding-tip-actions{display:flex;align-items:center;justify-content:flex-end;gap:4px;margin-top:6px}.onboarding-tip-actions form{margin:0}.onboarding-tip-actions form[data-onboarding-skip]{margin-right:auto}.onboarding-tip-actions button{min-height:36px;padding:0 14px;border:0;border-radius:999px;font-size:var(--font-small, .875rem);cursor:pointer}.onboarding-tip-skip{margin-left:-10px;background:none;color:var(--app-subtle)}.onboarding-tip-skip:hover,.onboarding-tip-skip:focus-visible{color:var(--app-text)}.onboarding-tip-next{background:var(--app-accent);color:var(--app-bg);font-weight:700}.onboarding-tip-next:hover,.onboarding-tip-next:focus-visible{background:color-mix(in srgb,var(--app-accent) 85%,var(--app-text))}.onboarding-tip-arrow{position:absolute;width:12px;height:12px;border:1px solid var(--app-accent);background:var(--app-surface-raised, var(--app-surface));transform:rotate(45deg)}.onboarding-tip[data-side=above] .onboarding-tip-arrow{bottom:-7px;left:calc(var(--tip-arrow, 50%) - 6px);border-top:0;border-left:0}.onboarding-tip[data-side=below] .onboarding-tip-arrow{top:-7px;left:calc(var(--tip-arrow, 50%) - 6px);border-right:0;border-bottom:0}.onboarding-tip[data-side=right] .onboarding-tip-arrow{top:calc(var(--tip-arrow, 50%) - 6px);left:-7px;border-top:0;border-right:0}.onboarding-tip-target{border-radius:14px;box-shadow:0 0 0 2px var(--app-accent)}.onboarding-confetti{position:fixed;z-index:1160;width:0;height:0;pointer-events:none}.onboarding-confetti span{position:absolute;top:-6px;left:-4px;width:8px;height:12px;border-radius:2px;background:var(--app-accent)}.onboarding-confetti span:nth-child(4n+1){background:var(--app-success)}.onboarding-confetti span:nth-child(4n+2){background:var(--app-warning)}.onboarding-confetti span:nth-child(4n+3){width:9px;height:9px;border-radius:50%;background:color-mix(in srgb,var(--app-accent) 55%,var(--app-text))}@media(prefers-reduced-motion:no-preference){.onboarding-tip:not([hidden]){animation:onboarding-tip-in .18s ease-out}@keyframes onboarding-tip-in{0%{opacity:0;transform:translateY(4px)}}.onboarding-card-bar span{transition:width .32s ease-out}.onboarding-step-label,.onboarding-step-mark{transition:color .2s ease-out,background-color .2s ease-out,border-color .2s ease-out}.onboarding-step.is-just-done .onboarding-step-mark{animation:onboarding-tick .28s cubic-bezier(.3,1.6,.5,1)}@keyframes onboarding-tick{0%{transform:scale(.5)}}.onboarding-step.is-promoted small,.onboarding-step.is-promoted .onboarding-step-action{animation:onboarding-tip-in .22s ease-out .12s both}}
