.toast-viewport{z-index:30;outline:none;flex-direction:column;gap:.6rem;width:min(22rem,100vw - 2rem);margin:0;padding:0;list-style:none;display:flex;position:fixed;bottom:1.25rem;right:1.25rem}.toast{background:var(--bg);border-radius:.5rem;align-items:flex-start;gap:.65rem;padding:.85rem 2.9rem .85rem .9rem;display:flex;position:relative;overflow:hidden;box-shadow:0 .75rem 2rem #0003}.toast[data-state=open]{animation:.18s toast-slide-in}.toast[data-state=closed]{animation:.2s forwards toast-fade-out}.toast[data-swipe=move]{transform:translateX(var(--radix-toast-swipe-move-x))}.toast[data-swipe=cancel]{transition:transform .18s;transform:translate(0)}.toast[data-swipe=end]{animation:.15s forwards toast-swipe-out}@keyframes toast-slide-in{0%{opacity:0;transform:translate(1.5rem)}to{opacity:1;transform:translate(0)}}@keyframes toast-fade-out{0%{opacity:1}to{opacity:0}}@keyframes toast-swipe-out{0%{transform:translateX(var(--radix-toast-swipe-end-x))}to{opacity:0;transform:translateX(calc(var(--radix-toast-swipe-end-x) + 2rem))}}.toast__icon{flex:none;margin-top:.1rem;display:inline-flex}.toast__icon--artwork{align-items:center;width:3.5rem;height:3.5rem;margin-top:0}.toast__icon--artwork img{width:100%;height:100%}.toast__icon--artwork+.toast__body{align-self:center}.toast--info .toast__icon{color:var(--accent)}.toast--success .toast__icon{color:#2f7a3f}.toast--error .toast__icon{color:var(--highlight)}.toast--error{background:#fff1f1;border:1px solid #bd2d2d}.toast--error .toast__title{color:#7c1717}.toast__body{min-width:0}.toast__title{font-family:var(--sans);color:var(--fg);margin:0;font-size:.9rem;font-weight:600}.toast__description{font-family:var(--sans);color:var(--muted);margin:.2rem 0 0;font-size:.8rem;line-height:1.4}.melody-tutorial-example{width:100%;color:var(--fg);font-family:var(--serif);white-space:nowrap;margin-top:.65rem;font-size:1.2rem;display:flex;overflow:hidden}.melody-tutorial-example__unit{flex:none;grid-template-rows:1.1em 1.35em;align-items:start;display:inline-grid}.melody-tutorial-example__lyrics{align-items:flex-end;height:1.1em;display:flex}.melody-tutorial-example__lyric{line-height:1.1;position:relative}.melody-tutorial-example__lyric:after{content:"";background:var(--syllable-underline);height:2px;position:absolute;bottom:.05em;left:.14em;right:.14em}.melody-tutorial-example__lyric--single-letter:after{left:0;right:0}.melody-tutorial-example__note{color:var(--accent);font-family:var(--sans);text-align:left;padding-top:.14rem;font-size:.85rem;font-weight:500;line-height:1.15}.melody-tutorial-example__gap{flex:none;width:.4em;height:1.1em;position:relative}.melody-tutorial-example__gap--merged{width:.04em}.melody-tutorial-example__gap--word-boundary{width:.6em}.melody-tutorial-example__gap--merged:after{content:"";background:var(--syllable-underline);height:2px;position:absolute;bottom:.05em;left:-.14em;right:-.14em}.melody-tutorial-example--typing .melody-tutorial-example__note--typing{clip-path:inset(0 100% 0 0);animation:.16s ease-out forwards melody-tutorial-note-appear}.melody-tutorial-example__note--blink{color:var(--chord);animation:2.4s ease-in-out infinite melody-tutorial-note-blink}@keyframes melody-tutorial-note-blink{0%,to{background-color:#0000}50%{background-color:#f4ddd6}}@keyframes melody-tutorial-note-appear{0%{clip-path:inset(0 100% 0 0);transform:translateY(-.15em)}to{clip-path:inset(0);transform:translateY(0)}}.chord-tutorial-example{width:100%;color:var(--fg);font-family:var(--serif);white-space:nowrap;margin-top:.65rem;font-size:1.2rem;display:flex;overflow:hidden}.chord-tutorial-example__unit{flex:none;grid-template-rows:1.5em 1.1em;align-items:end;display:inline-grid;position:relative}.chord-tutorial-example__unit--wide{min-width:1.9rem}.chord-tutorial-example__chords{color:var(--chord);font-family:var(--sans);font-size:.9rem;font-weight:500;line-height:1.3}.chord-tutorial-example__chord{position:absolute;top:0;left:0}.chord-tutorial-example__lyric{justify-self:start;line-height:1.1;position:relative}.chord-tutorial-example__lyric:after{content:"";background:var(--syllable-underline);height:2px;position:absolute;bottom:.05em;left:.14em;right:.14em}.chord-tutorial-example__drop{background:var(--highlight);opacity:0;pointer-events:none;height:3px;position:absolute;bottom:.05em;left:.14em;right:.14em}.chord-tutorial-example__edge .chord-tutorial-example__drop{left:0;right:0}.chord-tutorial-example__gap{flex:none;width:.4em}.chord-tutorial-example__gap--word-boundary{width:.6em}.toast__close{width:2.25rem;height:2.25rem;color:var(--muted);justify-content:center;align-items:center;display:inline-flex;position:absolute;top:.4rem;right:.4rem}.toast__close:hover{color:var(--fg)}.toast__timer{background:var(--border-strong);transform-origin:0;width:100%;height:2px;animation:linear forwards toast-timer-shrink;position:absolute;bottom:0;left:0}.toast:hover .toast__timer,.toast:focus-within .toast__timer{animation-play-state:paused}@keyframes toast-timer-shrink{0%{transform:scaleX(1)}to{transform:scaleX(0)}}@media (prefers-reduced-motion:reduce){.toast,.toast__timer,.melody-tutorial-example__note--blink{animation:none!important}.melody-tutorial-example--typing .melody-tutorial-example__note--typing{clip-path:none}}