#welcomeTour{width:min(570px,calc(100vw - 28px));max-height:calc(100dvh - 32px);padding:0;overflow:auto;border:1px solid #80daed;border-radius:24px;color:#f8faff;background:linear-gradient(145deg,#101a30,#16132c);box-shadow:0 0 42px #9b5cff25}#welcomeTour::backdrop{background:#030615b8;backdrop-filter:blur(5px)}.tour-shell{padding:32px}.tour-skip{display:block;margin-left:auto;background:none;border:0;color:#c4d5e9;font:inherit;min-height:44px;cursor:pointer}.tour-eyebrow{font-size:.8rem;letter-spacing:.09em;color:#9deaff}.tour-track{height:3px;background:#29334f;margin:16px 0 30px}.tour-track span{display:block;height:100%;background:linear-gradient(90deg,#65eaff,#b798ff)}#tourTitle{font-size:clamp(1.7rem,5vw,2.2rem);line-height:1.15;margin:12px 0 20px}#tourBody,#tourHint{font-size:1rem;line-height:1.7;color:#d1daea}.tour-hint{padding:16px;border-left:2px solid #b798ff;background:#0b122477;border-radius:0 10px 10px 0}.tour-buttons{display:flex;justify-content:space-between;gap:14px;margin-top:28px}.tour-buttons button,#tourSignIn{min-height:46px}#tourSignIn{width:100%;margin-top:14px}#welcomeTour button:focus-visible{outline:2px solid #a3edff;outline-offset:3px}#tourTitle:focus{outline:none}#replayWelcomeTour{margin:0 0 18px}@media(max-width:500px){.tour-shell{padding:22px}#welcomeTour{border-radius:18px}}
#welcomeTour{box-sizing:border-box;max-width:calc(100vw - 28px);max-height:calc(100dvh - 32px);margin:auto;overscroll-behavior:contain}
#welcomeTour .tour-shell{box-sizing:border-box;min-width:0}
#welcomeTour[open]{animation:helper-arrive .5s ease-out both}
@keyframes helper-arrive{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
@media(max-height:600px){#welcomeTour .tour-shell{padding:20px}#welcomeTour .tour-track{margin:10px 0 16px}#welcomeTour #tourBody,#welcomeTour #tourHint{line-height:1.5}}
@media(prefers-reduced-motion:reduce){#welcomeTour[open]{animation:none}}
#welcomeTour .tour-shell{position:relative;isolation:isolate;overflow:hidden}
#welcomeTour .tour-shell>*:not(.tour-heart-rain){position:relative;z-index:1}
.tour-heart-rain{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0;border-radius:inherit}
.tour-heart-rain span{position:absolute;bottom:-48px;left:var(--heart-x);font-size:var(--heart-size);color:var(--heart-color);opacity:0;animation:tour-heart-volume var(--heart-speed) linear infinite;animation-delay:var(--heart-delay);animation-play-state:paused;user-select:none}
#welcomeTour[open]:not(.hearts-still) .tour-heart-rain span{animation-play-state:running}
@keyframes tour-heart-volume{0%{opacity:0;transform:translate3d(0,0,0)}15%{opacity:.2}65%{opacity:.14}100%{opacity:0;transform:translate3d(var(--heart-drift),calc(-1 * var(--heart-rise,160px)),0)}}
.tour-heart-toggle{display:block;margin:18px 0 0;background:#0b142566;border:1px solid #9cd8ef44;border-radius:20px;color:#c2d1e5;font:12px system-ui;min-height:36px;padding:8px 13px;cursor:pointer}
@media(prefers-reduced-motion:reduce){#welcomeTour .tour-heart-rain{display:none}#welcomeTour .tour-heart-rain span{animation:none!important}}


/* Hearts sway independently from the upward drift and cycle through the main chart palette. */
.tour-heart-swimmer{display:block;position:relative;font-weight:normal;animation:heart-swim var(--heart-wiggle) ease-in-out infinite alternate;animation-delay:var(--heart-delay);animation-play-state:paused}
.tour-heart-swimmer i{display:block;font-style:normal;line-height:1;text-align:center}

#welcomeTour[open]:not(.hearts-still) .tour-heart-swimmer{animation-play-state:running}
@keyframes heart-swim{from{transform:translateX(-10px) rotate(-7deg)}to{transform:translateX(10px) rotate(7deg)}}

@media(prefers-reduced-motion:reduce){.tour-heart-swimmer{animation:none!important}}.tour-heart-swimmer i{animation:tour-heart-colors 24s ease-in-out infinite;animation-delay:var(--heart-delay);animation-play-state:paused}
#welcomeTour[open]:not(.hearts-still) .tour-heart-swimmer i{animation-play-state:running}
@keyframes tour-heart-colors{0%,100%{color:rgb(0,212,255)}17%{color:rgb(220,105,255)}34%{color:rgb(69,245,170)}51%{color:rgb(255,203,103)}68%{color:rgb(156,164,255)}85%{color:rgb(255,131,191)}}
@media(prefers-reduced-motion:reduce){.tour-heart-swimmer i{animation:none!important}}