.nav-outer-wrapper[data-v-7979e734]{margin-left:auto;margin-right:auto}.nav-outer-wrapper[data-v-7979e734],.nav-top-bg[data-v-7979e734]{position:fixed;left:0;right:0;top:0;z-index:20;transition-duration:.5s}.nav-top-bg[data-v-7979e734]{pointer-events:none;opacity:0;--tw-backdrop-blur:blur(16px);-webkit-backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);height:calc(1.25rem + var(--nav-space));-webkit-mask-image:linear-gradient(180deg,black 40%,transparent);mask-image:linear-gradient(180deg,black 40%,transparent)}.collapse-nav .nav-top-bg[data-v-7979e734]{opacity:1}.nav-bottom-bg[data-v-7979e734],.nav-top-fade[data-v-7979e734]{display:none}.nav-bar[data-v-7979e734]{position:absolute;top:0;left:0;z-index:20;display:flex;width:100%;scrollbar-width:none}@media(min-width:768px){.nav-bar[data-v-7979e734]{margin-top:.25rem}}.nav[data-v-7979e734]{display:flex;width:-moz-fit-content;width:fit-content;cursor:pointer;align-items:center;white-space:nowrap;border-bottom-width:2px;border-color:transparent;padding:1.25rem;text-align:center;font-size:.75rem;line-height:1rem;color:rgb(255 255 255/var(--tw-text-opacity,1));--tw-text-opacity:.6;transition-duration:.5s}.nav-text[data-v-7979e734]{padding-left:.5rem}.nav-icon[data-v-7979e734]{margin:.25rem;transition-property:width;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.5s}.nav-active[data-v-7979e734]{color:rgb(255 255 255/var(--tw-text-opacity,1));--tw-text-opacity:1}.inner-nav-wrapper[data-v-7979e734]{display:flex}.user-row[data-v-7979e734]{position:absolute;right:0;z-index:20;padding:.25rem;transition-duration:.5s;padding-top:max(.25rem,env(safe-area-inset-top));height:calc(3.45rem + max(.25rem,env(safe-area-inset-top)))}@media(max-width:767px){.user-row[data-v-7979e734]{position:fixed;width:100%}}@media(min-width:768px){.user-row[data-v-7979e734]{margin-top:1.25rem}.collapse-nav .user-row[data-v-7979e734]{margin-top:.5rem}.nav-top-bg[data-v-7979e734]{height:6rem;-webkit-mask-image:linear-gradient(0deg,transparent,black 30%);mask-image:linear-gradient(0deg,transparent,black 30%)}.nav-outer-wrapper[data-v-7979e734]{height:var(--nav-height);max-width:var(--nav-max-w);width:var(--page-center-width)}.nav-wrapper[data-v-7979e734]{width:66.666667%;overflow-x:scroll}.nav-active[data-v-7979e734]{background-color:rgb(255 255 255/var(--tw-bg-opacity,1));--tw-bg-opacity:.1}.nav[data-v-7979e734]{margin-left:.25rem;margin-right:.25rem;margin-top:1.5rem;border-radius:9999px;padding:.25rem 1rem}.nav[data-v-7979e734]:hover{background-color:rgb(255 255 255/var(--tw-bg-opacity,1));--tw-bg-opacity:.9;color:rgb(0 0 0/var(--tw-text-opacity,1));--tw-text-opacity:1}.collapse-nav .nav[data-v-7979e734]{margin-top:.75rem;opacity:.8}}@media(max-width:767px){.nav-top-fade[data-v-7979e734]{top:0;height:calc(1.25rem + var(--nav-space));background:linear-gradient(180deg,#000,rgba(0,0,0,.6) 25%,rgba(0,0,0,.3) 50%,rgba(0,0,0,.1) 75%,transparent)}.nav-bottom-bg[data-v-7979e734],.nav-top-fade[data-v-7979e734]{pointer-events:none;position:fixed;left:0;right:0;z-index:20;display:block}.nav-bottom-bg[data-v-7979e734]{bottom:0;height:4rem;background:linear-gradient(0deg,#000,transparent)}.nav-bar[data-v-7979e734]{position:fixed;top:auto;left:0;right:0;margin-left:auto;margin-right:auto;height:3rem;width:-moz-fit-content;width:fit-content;align-items:center;border-radius:9999px;border-top-width:1px;--tw-border-opacity:1;border-top-color:rgb(75 85 99/var(--tw-border-opacity,1));background-color:rgb(75 85 99/var(--tw-bg-opacity,1));--tw-bg-opacity:.4;padding-left:.25rem;padding-right:.25rem;--tw-backdrop-blur:blur(16px);-webkit-backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);bottom:max(.5rem,env(safe-area-inset-bottom));overflow-y:hidden;overscroll-behavior:none;touch-action:pan-x}.inner-nav-wrapper[data-v-7979e734]{width:100%;justify-content:space-evenly}.nav[data-v-7979e734]{height:2.5rem;padding:.75rem}.nav-active[data-v-7979e734]{border-radius:9999px;background-color:rgb(255 255 255/var(--tw-bg-opacity,1));--tw-bg-opacity:.1}.nav-text[data-v-7979e734]{display:none}.nav-icon[data-v-7979e734]{width:1.25rem}}@media(display-mode:standalone){.nav-top-fade[data-v-7979e734]{display:none}}.right-slide-over[data-v-7a90f71d]{pointer-events:none;position:fixed;right:0;bottom:0;z-index:20;flex-shrink:0}.right-slide-over-inner[data-v-7a90f71d]{width:100%;max-height:calc(100vh - 4rem);max-height:calc(100dvh - 4rem);height:auto}@media(max-width:1023px){.right-slide-over[data-v-7a90f71d]{left:0;z-index:30;margin-left:auto;margin-right:auto;height:-moz-fit-content;height:fit-content;width:100%;max-width:42rem}.slide-over-overlay[data-v-7a90f71d]{position:fixed;inset:0;z-index:30;background-color:rgb(0 0 0/var(--tw-bg-opacity,1));--tw-bg-opacity:.5}}@media(min-width:1024px){.right-slide-over[data-v-7a90f71d]{width:var(--half-page-right)}.right-slide-over-inner[data-v-7a90f71d]{position:absolute;max-width:var(--half-page-right-inner)}}.song-panel-layer[data-v-7a90f71d]{animation:page-in .2s ease-out}.detail-slide-enter-active[data-v-7a90f71d]{transition:.5s}.detail-slide-leave-active[data-v-7a90f71d]{transition:all .35s}.detail-slide-enter-from[data-v-7a90f71d],.detail-slide-leave-to[data-v-7a90f71d]{transform:translate(40%);opacity:0}@media(max-width:1023px){.detail-slide-enter-active[data-v-7a90f71d]{transition:.35s}.detail-slide-leave-active[data-v-7a90f71d]{transition:all .35s}.detail-slide-enter-from[data-v-7a90f71d],.detail-slide-leave-to[data-v-7a90f71d]{transform:translateY(100%) scale(.9);opacity:1}}.app-shell.with-nav[data-v-d71b533f]{--nav-space:calc(var(--nav-height) + max(.25rem, env(safe-area-inset-top)));--page-top:var(--nav-space)}.page-area[data-v-d71b533f]{padding-top:var(--nav-space);padding-left:max(env(safe-area-inset-left),env(safe-area-inset-right));padding-right:max(env(safe-area-inset-left),env(safe-area-inset-right))}@media(min-width:768px){.app-shell.with-nav[data-v-d71b533f]{--page-top:0px}.page-area[data-v-d71b533f]{position:fixed;top:var(--nav-space);bottom:0;left:max(env(safe-area-inset-left),env(safe-area-inset-right));right:max(env(safe-area-inset-left),env(safe-area-inset-right));padding:0;overflow-x:hidden;overflow-y:scroll;scrollbar-gutter:stable}.fullscreen-page .page-area[data-v-d71b533f]{scrollbar-width:none}.fullscreen-page .page-area[data-v-d71b533f]::-webkit-scrollbar{display:none}}