@import "https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;500;600;700&display=swap";:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;color:#ffffffde;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--navbar-height:60px;--card-size:250px;background-color:#131c26;font-family:Open Sans,-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif;font-weight:400;line-height:1.5}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}*{box-sizing:border-box;margin:0;padding:0}html,body{overflow-x:hidden}body{width:100%;min-height:100vh;margin:0;position:relative}#root{flex-direction:column;width:100%;min-height:100vh;display:flex}a{color:#e06588;-webkit-text-decoration:inherit;text-decoration:inherit;font-weight:500}a:hover{color:#db5279}h1{font-size:3.2em;line-height:1.1}button{cursor:pointer;background-color:#1a1a1a;border:1px solid #0000;border-radius:8px;padding:.6em 1.2em;font-family:inherit;font-size:1em;font-weight:500;transition:border-color .25s}button:hover{border-color:#e06588}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme:light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}.album-grid{grid-template-columns:repeat(auto-fill, var(--card-size));box-sizing:border-box;justify-content:center;gap:3rem 2.5rem;width:100%;padding:1rem;display:grid}.app-layout{display:flex}.main-content{flex:1;padding:1rem 1rem 1rem 20vw;overflow-y:auto}.album-card{width:100%;max-width:var(--card-size);background-color:#111;border-radius:4px;transition:transform .2s,box-shadow .2s;position:relative;overflow:hidden;box-shadow:0 4px 6px #00000080}.album-card:hover{transform:translateY(-5px);box-shadow:0 8px 12px #000000b3}.album-cover{cursor:pointer;background-color:#222;width:100%;padding-top:100%;position:relative;overflow:hidden}.album-cover img{object-fit:cover;width:100%;height:100%;position:absolute;top:0;left:0}.album-overlay{opacity:0;background:linear-gradient(#0000001a,#000c);width:100%;height:100%;transition:opacity .2s;position:absolute;top:0;left:0}.album-card:hover .album-overlay{opacity:1}.album-card h3,.album-card p{text-align:left}.listened{color:#000;box-sizing:border-box;background-color:#ffffff1a;border:none;border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;padding:0;font-size:1.1rem;line-height:1;transition:color .2s,background-color .2s;display:flex;position:absolute;top:8px;left:8px}.card-rating{position:absolute;bottom:0;right:0}.album-info{position:relative}.album-card h3{color:#a0b0c2;text-overflow:ellipsis;white-space:nowrap;margin:8px 12px 4px;font-size:1rem;font-weight:600;overflow:hidden}.album-card h4{color:#66707a;text-overflow:ellipsis;white-space:nowrap;cursor:pointer;margin:8px 12px 2px;font-size:.9rem;font-weight:600;overflow:hidden}.album-card p{color:#66707a;margin:0 12px 8px;font-size:.85rem}.home{box-sizing:border-box;width:100%;padding:2rem 0;padding-top:var(--navbar-height)}.search-form{box-sizing:border-box;gap:.2rem;max-width:600px;margin:0 auto 2rem;padding:0 1rem;display:flex}.search-input{color:#d98ba1;background-color:#09111b;border:none;border-radius:4px;flex:1;height:44px;padding:.75rem 1rem;font-size:1rem}.search-input::placeholder{color:#d7d7d7;opacity:1}.search-input:focus{outline:none;box-shadow:0 0 0 1px #e06588}.search-button{color:#e06588;white-space:nowrap;background-color:#24275e;border-radius:4px;height:44px;padding:.75rem 1.5rem;font-weight:500;transition:background-color .2s}.search-button:hover{color:#db5279;background-color:#181a3f}.error-message{color:red}@media (width<=639px){.home{padding:1rem 0}.search-form{margin-bottom:1rem}}.my-music-empty h2,.my-album-list h2,p{text-align:center}.my-music{padding-top:var(--navbar-height)}.my-music-controls{box-sizing:border-box;align-items:center;gap:.2rem;max-width:600px;margin:1rem auto 2rem;padding:0 1rem;display:flex}.search-input,.sort-controls select,.sort-controls button{box-sizing:border-box;color:#d98ba1;background-color:#09111b;border:none;border-radius:4px;justify-content:center;align-items:center;height:44px;padding:0 1rem;font-size:1rem;display:flex}.search-input:focus,.sort-controls select:focus,.sort-controls button:focus{outline:none;box-shadow:0 0 0 1px #e06588}.search-input{flex:4}.sort-controls select{flex:2}.sort-controls button{flex:1}.sort-controls{flex:1;align-items:center;gap:.2rem;display:flex}.navbar{height:var(--navbar-height);z-index:1000;background-color:#0d141b;justify-content:space-between;align-items:center;width:100%;padding:1rem 2rem;display:flex;position:fixed;box-shadow:0 2px 4px #0000001a}.navbar-brand{font-size:1.5rem;font-weight:700}.navbar-links{gap:2rem;display:flex}.nav-link{border-radius:4px;justify-content:center;align-items:center;padding:.5rem 1rem;font-size:1rem;transition:background-color .2s;display:inline-flex}.nav-link:hover{background-color:#ffffff1a}.log-in-out{justify-content:center;align-items:center;display:inline-flex;position:relative}.log-in-out button{color:#fff;cursor:pointer;background-color:#131c26;align-items:center;padding:.5rem 1rem .5rem 2.5rem;font-size:1rem;transition:background-color .2s,transform .1s;display:inline-flex;position:relative}.log-in-out button:before{content:"";background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='800' width='1200' viewBox='-33.4974 -55.829 290.3108 334.974'%3E%3Cpath d='M177.707 98.987c-35.992-21.375-95.36-23.34-129.719-12.912-5.519 1.674-11.353-1.44-13.024-6.958-1.672-5.521 1.439-11.352 6.96-13.029 39.443-11.972 105.008-9.66 146.443 14.936 4.964 2.947 6.59 9.356 3.649 14.31-2.944 4.963-9.359 6.6-14.31 3.653m-1.178 31.658c-2.525 4.098-7.883 5.383-11.975 2.867-30.005-18.444-75.762-23.788-111.262-13.012-4.603 1.39-9.466-1.204-10.864-5.8a8.717 8.717 0 015.805-10.856c40.553-12.307 90.968-6.347 125.432 14.833 4.092 2.52 5.38 7.88 2.864 11.968m-13.663 30.404a6.954 6.954 0 01-9.569 2.316c-26.22-16.025-59.223-19.644-98.09-10.766a6.955 6.955 0 01-8.331-5.232 6.95 6.95 0 015.233-8.334c42.533-9.722 79.017-5.538 108.448 12.446a6.96 6.96 0 012.31 9.57M111.656 0C49.992 0 0 49.99 0 111.656c0 61.672 49.992 111.66 111.657 111.66 61.668 0 111.659-49.988 111.659-111.66C223.316 49.991 173.326 0 111.657 0' fill='%231ed660'/%3E%3C/svg%3E") 50%/contain no-repeat;width:1rem;height:1rem;position:absolute;left:.8rem;transform:scale(3.5)}.log-in-out button:hover{color:#000;background-color:#1db954}.info-button{cursor:pointer;background:url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23e06588' fill-rule='evenodd' clip-rule='evenodd' d='M12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2ZM12.2666 11C12.8189 11 13.2666 11.4477 13.2666 12V16C13.2666 16.5523 12.8189 17 12.2666 17C11.7143 17 11.2666 16.5523 11.2666 16V12C11.2666 11.4477 11.7143 11 12.2666 11ZM11.2666 8C11.2666 7.44772 11.7143 7 12.2666 7H12.2766C12.8289 7 13.2766 7.44772 13.2766 8C13.2766 8.55228 12.8289 9 12.2766 9H12.2666C11.7143 9 11.2666 8.55228 11.2666 8Z'/%3E%3C/svg%3E") 50%/50% 50% no-repeat;border:none;border-radius:50%;justify-content:center;align-items:center;width:3rem;height:3rem;padding:0;transition:background-color .2s,transform .1s;display:inline-flex}.info-button:hover{background:url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23db5279' fill-rule='evenodd' clip-rule='evenodd' d='M12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2ZM12.2666 11C12.8189 11 13.2666 11.4477 13.2666 12V16C13.2666 16.5523 12.8189 17 12.2666 17C11.7143 17 11.2666 16.5523 11.2666 16V12C11.2666 11.4477 11.7143 11 12.2666 11ZM11.2666 8C11.2666 7.44772 11.7143 7 12.2666 7H12.2766C12.8289 7 13.2766 7.44772 13.2766 8C13.2766 8.55228 12.8289 9 12.2766 9H12.2666C11.7143 9 11.2666 8.55228 11.2666 8Z'/%3E%3C/svg%3E") 50%/50% 50% no-repeat}@media (width<=768px){.navbar{padding:1rem}.navbar-brand{font-size:1.2rem}.navbar-links{gap:1rem}.nav-link{padding:.5rem}}.playlist-list{background-color:#ffffff0d;flex-direction:column;gap:.25rem;display:flex}.playlist-item{cursor:pointer;border-radius:4px;align-items:center;gap:.5rem;padding:.25rem .5rem;transition:background-color .2s;display:flex;position:relative}.playlist-item:hover{background-color:#ffffff0d}.playlist-img{object-fit:cover;border-radius:4px;flex-shrink:0;width:40px;height:40px}.playlist-name{white-space:nowrap;text-overflow:ellipsis;color:#fff;flex:1;overflow:hidden}.playlist-play-btn{opacity:0;color:#db5279;background:0 0;border:none;font-size:1rem;transition:opacity .2s;position:absolute;right:.5rem}.playlist-item:hover .playlist-play-btn{opacity:1}.player-sidebar{--sidebar-width:20vw;width:var(--sidebar-width);color:#fff;box-sizing:border-box;min-width:200px;height:100vh;padding:1rem;padding-top:calc(1rem + var(--navbar-height));background-color:#111;flex-direction:column;display:flex;position:fixed;bottom:0}.player-album-art{cursor:pointer;border-radius:8px;width:100%}.player-info{flex-direction:column;align-items:flex-start;margin-top:.5rem;display:flex}.player-track{margin:0;font-size:1rem}.player-artist{color:#ccc;text-align:left;margin:0;font-size:.95rem}.player-time{color:#ccc;justify-content:space-between;align-items:center;font-size:.75rem;display:flex}.progress-slider{margin-top:-2px}.progress-slider .rc-slider-rail{background-color:#5a6168}.progress-slider .rc-slider-track{background-color:#db5279}.player-controls{justify-content:space-between;align-items:center;gap:.3rem;margin-top:5px;display:flex}.player-controls button{cursor:pointer;background-color:#db527983;border-radius:2px;flex:0 0 15%;min-width:40px;min-height:25px}.player-controls button:hover{background-color:#db5279c0}.prev{background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.09015 14.6474C6.30328 13.4935 6.30328 10.5065 8.09015 9.35258L18.8792 2.38548C20.6158 1.26402 22.75 2.72368 22.75 5.0329V18.9671C22.75 21.2763 20.6158 22.736 18.8792 21.6145L8.09015 14.6474Z' fill='%23FFFFFF'/%3E%3Cpath d='M2 5C2 4.58579 2.33579 4.25 2.75 4.25C3.16421 4.25 3.5 4.58579 3.5 5V19C3.5 19.4142 3.16421 19.75 2.75 19.75C2.33579 19.75 2 19.4142 2 19V5Z' fill='%23FFFFFF'/%3E%3C/svg%3E");background-position:50%;background-repeat:no-repeat;background-size:40%}.next{background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16.6598 14.6474C18.4467 13.4935 18.4467 10.5065 16.6598 9.35258L5.87083 2.38548C4.13419 1.26402 2 2.72368 2 5.0329V18.9671C2 21.2763 4.13419 22.736 5.87083 21.6145L16.6598 14.6474Z' fill='%23FFFFFF'/%3E%3Cpath d='M22.75 5C22.75 4.58579 22.4142 4.25 22 4.25C21.5858 4.25 21.25 4.58579 21.25 5V19C21.25 19.4142 21.5858 19.75 22 19.75C22.4142 19.75 22.75 19.4142 22.75 19V5Z' fill='%23FFFFFF'/%3E%3C/svg%3E");background-position:50%;background-repeat:no-repeat;background-size:40%}.play{background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M21.4086 9.35258C23.5305 10.5065 23.5305 13.4935 21.4086 14.6474L8.59662 21.6145C6.53435 22.736 4 21.2763 4 18.9671L4 5.0329C4 2.72368 6.53435 1.26402 8.59661 2.38548L21.4086 9.35258Z' fill='%23fff'/%3E%3C/svg%3E");background-position:50%;background-repeat:no-repeat;background-size:50%}.pause{background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2 6C2 4.11438 2 3.17157 2.58579 2.58579C3.17157 2 4.11438 2 6 2C7.88562 2 8.82843 2 9.41421 2.58579C10 3.17157 10 4.11438 10 6V18C10 19.8856 10 20.8284 9.41421 21.4142C8.82843 22 7.88562 22 6 22C4.11438 22 3.17157 22 2.58579 21.4142C2 20.8284 2 19.8856 2 18V6Z' fill='%23FFFFFF'/%3E%3Cpath d='M14 6C14 4.11438 14 3.17157 14.5858 2.58579C15.1716 2 16.1144 2 18 2C19.8856 2 20.8284 2 21.4142 2.58579C22 3.17157 22 4.11438 22 6V18C22 19.8856 22 20.8284 21.4142 21.4142C20.8284 22 19.8856 22 18 22C16.1144 22 15.1716 22 14.5858 21.4142C14 20.8284 14 19.8856 14 18V6Z' fill='%23FFFFFF'/%3E%3C/svg%3E");background-position:50%;background-repeat:no-repeat;background-size:40%}.shuffle-on{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M21 16.0399H17.7707C15.8164 16.0399 13.9845 14.9697 12.8611 13.1716L10.7973 9.86831C9.67384 8.07022 7.84196 7 5.88762 7L3 7'/%3E%3Cpath d='M21 7H17.7707C15.8164 7 13.9845 8.18388 12.8611 10.1729L10.7973 13.8271C9.67384 15.8161 7.84196 17 5.88762 17L3 17'/%3E%3Cpath d='M19 4L22 7L19 10'/%3E%3Cpath d='M19 13L22 16L19 19'/%3E%3C/svg%3E");background-position:50%;background-repeat:no-repeat;background-size:50%}.shuffle-off{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M21 16.0399H17.7707C15.8164 16.0399 13.9845 14.9697 12.8611 13.1716L10.7973 9.86831C9.67384 8.07022 7.84196 7 5.88762 7L3 7'/%3E%3Cpath d='M21 7H17.7707C15.8164 7 13.9845 8.18388 12.8611 10.1729L10.7973 13.8271C9.67384 15.8161 7.84196 17 5.88762 17L3 17'/%3E%3Cpath d='M19 4L22 7L19 10'/%3E%3Cpath d='M19 13L22 16L19 19'/%3E%3Cline x1='2' y1='2' x2='22' y2='22' stroke='%23fff' stroke-width='2' stroke-linecap='square'/%3E%3C/svg%3E");background-position:50%;background-repeat:no-repeat;background-size:50%}.player-volume{flex:auto;align-items:center;min-width:80px;margin-left:.5rem;display:flex}.volume-slider{cursor:pointer;width:100%}.volume-slider .rc-slider-rail{background-color:#5a6168}.volume-slider .rc-slider-track{background-color:#db5279}.volume-display{color:#ccc;flex:none;font-size:1.2vh}.context-hud{margin-top:5px;display:flex;position:relative}.now-playing{flex:2;gap:10px;display:flex}.crop-image{border-radius:4px;flex-shrink:0;width:50px;height:50px;overflow:hidden}.now-playing-art{object-fit:cover;object-position:center;width:100%;height:100%}.now-playing-name{word-break:break-word;color:#ccc;min-width:0;font-size:.95rem}.up-next{text-align:right;flex:1;margin-top:auto;margin-left:auto}.up-next-text{color:#b3b3b3;font-size:.7rem}.player-username{color:#fff;font-size:1.5vh}.player-spacer{flex:1}.player-middle{flex-direction:column;flex:1;justify-content:flex-end;display:flex}.player-playlists{max-height:40vh;margin-top:1vh;margin-bottom:1vh;overflow-y:auto}.player-profile{align-items:center;gap:.5rem;display:flex}.player-profile img{border-radius:50%;width:32px;height:32px}.rc-slider{touch-action:none;box-sizing:border-box;-webkit-tap-highlight-color:#0000;border-radius:6px;width:100%;height:14px;padding:5px 0;position:relative}.rc-slider *{box-sizing:border-box;-webkit-tap-highlight-color:#0000}.rc-slider-rail{background-color:#e9e9e9;border-radius:6px;width:100%;height:4px;position:absolute}.rc-slider-track,.rc-slider-tracks{background-color:#abe2fb;border-radius:6px;height:4px;position:absolute}.rc-slider-track-draggable{z-index:1;box-sizing:content-box;background-clip:content-box;border-top:5px solid #0000;border-bottom:5px solid #0000;transform:translateY(-5px)}.rc-slider-handle{z-index:1;cursor:pointer;width:14px;height:14px;cursor:-webkit-grab;cursor:grab;opacity:.8;-webkit-user-select:none;user-select:none;touch-action:pan-x;background-color:#fff;border:2px solid #96dbfa;border-radius:50%;margin-top:-5px;position:absolute}.rc-slider-handle-dragging.rc-slider-handle-dragging.rc-slider-handle-dragging{border-color:#57c5f7;box-shadow:0 0 0 5px #96dbfa}.rc-slider-handle-dragging.rc-slider-handle-dragging.rc-slider-handle-dragging-delete{opacity:0}.rc-slider-handle:focus{box-shadow:none;outline:none}.rc-slider-handle:focus-visible{border-color:#2db7f5;box-shadow:0 0 0 3px #96dbfa}.rc-slider-handle-click-focused:focus{box-shadow:unset;border-color:#96dbfa}.rc-slider-handle:hover{border-color:#57c5f7}.rc-slider-handle:active{cursor:-webkit-grabbing;cursor:grabbing;border-color:#57c5f7;box-shadow:0 0 5px #57c5f7}.rc-slider-mark{width:100%;font-size:12px;position:absolute;top:18px;left:0}.rc-slider-mark-text{color:#999;text-align:center;vertical-align:middle;cursor:pointer;display:inline-block;position:absolute}.rc-slider-mark-text-active{color:#666}.rc-slider-step{background:0 0;width:100%;height:4px;position:absolute}.rc-slider-dot{vertical-align:middle;cursor:pointer;background-color:#fff;border:2px solid #e9e9e9;border-radius:50%;width:8px;height:8px;position:absolute;bottom:-2px}.rc-slider-dot-active{border-color:#96dbfa}.rc-slider-dot-reverse{margin-right:-4px}.rc-slider-disabled{background-color:#e9e9e9}.rc-slider-disabled .rc-slider-track{background-color:#ccc}.rc-slider-disabled .rc-slider-handle,.rc-slider-disabled .rc-slider-dot{box-shadow:none;cursor:not-allowed;background-color:#fff;border-color:#ccc}.rc-slider-disabled .rc-slider-mark-text,.rc-slider-disabled .rc-slider-dot{cursor:not-allowed!important}.rc-slider-vertical{width:14px;height:100%;padding:0 5px}.rc-slider-vertical .rc-slider-rail{width:4px;height:100%}.rc-slider-vertical .rc-slider-track{width:4px;bottom:0;left:5px}.rc-slider-vertical .rc-slider-track-draggable{border:0;border-left:5px solid #0000;border-right:5px solid #0000;transform:translate(-5px)}.rc-slider-vertical .rc-slider-handle{z-index:1;touch-action:pan-y;margin-top:0;margin-left:-5px;position:absolute}.rc-slider-vertical .rc-slider-mark{height:100%;top:0;left:18px}.rc-slider-vertical .rc-slider-step{width:4px;height:100%}.rc-slider-vertical .rc-slider-dot{margin-left:-2px}.rc-slider-tooltip-zoom-down-enter,.rc-slider-tooltip-zoom-down-appear,.rc-slider-tooltip-zoom-down-leave{animation-duration:.3s;animation-play-state:paused;animation-fill-mode:both;display:block!important}.rc-slider-tooltip-zoom-down-enter.rc-slider-tooltip-zoom-down-enter-active,.rc-slider-tooltip-zoom-down-appear.rc-slider-tooltip-zoom-down-appear-active{animation-name:rcSliderTooltipZoomDownIn;animation-play-state:running}.rc-slider-tooltip-zoom-down-leave.rc-slider-tooltip-zoom-down-leave-active{animation-name:rcSliderTooltipZoomDownOut;animation-play-state:running}.rc-slider-tooltip-zoom-down-enter,.rc-slider-tooltip-zoom-down-appear{animation-timing-function:cubic-bezier(.23,1,.32,1);transform:scale(0)}.rc-slider-tooltip-zoom-down-leave{animation-timing-function:cubic-bezier(.755,.05,.855,.06)}@keyframes rcSliderTooltipZoomDownIn{0%{transform-origin:50% 100%;opacity:0;transform:scale(0)}to{transform-origin:50% 100%;transform:scale(1)}}@keyframes rcSliderTooltipZoomDownOut{0%{transform-origin:50% 100%;transform:scale(1)}to{transform-origin:50% 100%;opacity:0;transform:scale(0)}}.rc-slider-tooltip{visibility:visible;box-sizing:border-box;-webkit-tap-highlight-color:#0000;position:absolute;top:-9999px;left:-9999px}.rc-slider-tooltip *{box-sizing:border-box;-webkit-tap-highlight-color:#0000}.rc-slider-tooltip-hidden{display:none}.rc-slider-tooltip-placement-top{padding:4px 0 8px}.rc-slider-tooltip-inner{color:#fff;text-align:center;background-color:#6c6c6c;border-radius:6px;min-width:24px;height:24px;padding:6px 2px;font-size:12px;line-height:1;text-decoration:none;box-shadow:0 0 4px #d9d9d9}.rc-slider-tooltip-arrow{border-style:solid;border-color:#0000;width:0;height:0;position:absolute}.rc-slider-tooltip-placement-top .rc-slider-tooltip-arrow{border-width:4px 4px 0;border-top-color:#6c6c6c;margin-left:-4px;bottom:4px;left:50%}.modal-overlay{z-index:9999;background:#0009;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal-content{background:#131c26;border-radius:12px;width:50vw;height:90vh;padding:2rem;animation:.2s ease-out fadeIn;box-shadow:0 8px 24px #0000004d}.album-modal{grid-template-columns:auto 20vw;height:100%;display:grid}.modal-left{text-align:left;flex-direction:column;grid-column:1;align-items:flex-start;display:flex}.modal-rating{position:relative}.album-art-wrapper img{object-fit:cover;border-radius:8px;width:300px;height:300px}.album-art-wrapper{display:inline-block;position:relative}.album-art-wrapper:hover .listened{opacity:1}.album-art-wrapper .listened{opacity:0;color:#000;box-sizing:border-box;background-color:#ffffff1a;border:none;border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;padding:0;font-size:1.1rem;line-height:1;transition:opacity .2s;display:flex;position:absolute;top:8px;left:8px}.listened:hover{background-color:#fff3}.listened.active{background-color:#00ff37dc}.album-name{font-size:1.5rem}.album-artists{color:#696969;font-size:1.2rem}.album-year{color:#555;font-size:1rem}.album-notes{justify-content:center;width:70%;display:flex}.album-notes textarea{resize:vertical;border:1px solid #ccc;border-radius:6px;width:100%;max-width:100%;min-height:300px;padding:.75rem;font-size:1rem;display:flex}.track-list{grid-column:2;width:100%;height:100%;margin-bottom:1rem;padding:0;list-style:none;overflow-y:auto}.track-row{border-bottom:1px solid #eee;grid-template-columns:2ch 1fr auto;align-items:center;gap:10px;padding:.5rem 0;font-size:1rem;display:grid}.track-number{text-align:right;opacity:.7}.track-duration{text-align:right;opacity:.7;min-width:45px}.play-button{color:#fff;cursor:pointer;background-color:#db527983;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M21.4086 9.35258C23.5305 10.5065 23.5305 13.4935 21.4086 14.6474L8.59662 21.6145C6.53435 22.736 4 21.2763 4 18.9671L4 5.0329C4 2.72368 6.53435 1.26402 8.59661 2.38548L21.4086 9.35258Z' fill='%23fff'/%3E%3C/svg%3E");background-position:50%;background-repeat:no-repeat;background-size:50%;border-radius:2px;flex:none;justify-content:center;align-items:center;width:3.5vh;height:3vh;margin-bottom:10px;padding-top:1vh;padding-bottom:1.4vh;font-size:2vh;display:flex}.play-button:hover{background-color:#db5279c0}@keyframes fadeIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.info-modal-overlay{z-index:9999;background:#0009;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.info-modal-content{background:#131c26;border-radius:12px;padding:2rem;animation:.2s ease-out fadeIn;box-shadow:0 8px 24px #0000004d}.divider{border-bottom:2px solid #eee;margin-top:10px;margin-bottom:10px}.info-modal-content h2{text-align:center}.info-modal-content p{text-align:left;margin:10px 0}