@charset "UTF-8";#app{width:100vw;height:100vh;overflow:hidden}body{-webkit-app-region:drag}body *,.icon,.icon-control,.icon-playing,.icon-sm,.icon-zhangjie,.icon-arrow,.random-instrument-btn,.slider-node,.slider-icon{-webkit-app-region:no-drag}.icon-wrapper{position:relative;display:inline-block;width:.6rem;height:.4rem;border-radius:.08rem;display:flex;align-items:center;justify-content:center;background:#4aaf8d;transition:background-color .2s ease}.icon-wrapper:hover{background:#f5b403}.icon-wrapper .dropdown-menu{position:absolute;top:100%;left:0;width:1.42rem;border-radius:.08rem;border:.01rem solid rgb(74,175,141);background:#fff;opacity:0;visibility:hidden;transition:all .2s ease;z-index:1000;padding:.08rem 0;margin-top:.08rem}.icon-wrapper .dropdown-menu .menu-item{width:1.42rem;height:.36rem;display:flex;align-items:center;padding-left:.16rem;color:#333;font-family:Noto Sans SC;font-size:.14rem;font-weight:400;cursor:pointer;transition:all .2s ease}.icon-wrapper .dropdown-menu .menu-item:hover{color:#4aaf8d;background:#fff;border-radius:.08rem}.icon-wrapper:hover .dropdown-menu{opacity:1;visibility:visible}.home{width:100vw;height:100vh;overflow:hidden;background:#f5f5f5;background-image:url(./bg-BS23w7r5.png);background-size:cover;background-position:center;background-repeat:no-repeat;display:flex;flex-direction:column;padding-bottom:.24rem}.header{position:fixed;top:0;left:0;right:0;height:.8rem;padding:.2rem .7rem;z-index:100;display:flex;justify-content:space-between;align-items:center}.header .header-left{display:flex;align-items:center}.header .header-left .box-left{width:1.8rem;height:.4rem;border-radius:.08rem;background:#4aaf8d;display:flex;align-items:center;justify-content:center}.header .header-left .box-left .box-icons{display:flex;gap:0;align-items:center}.header .header-left .box-left .box-icons .icon{width:.2rem;height:.2rem;cursor:pointer;transition:opacity .2s ease;display:block}.header .header-left .box-left .box-icons .icon:hover{opacity:.8}.header .header-right{display:flex;align-items:center;gap:0}.header .header-right .box-right{width:.6rem;height:.4rem;border-radius:.08rem;background:#4aaf8d;display:flex;align-items:center;justify-content:center;margin-right:.32rem;display:none}.header .header-right .box-right:nth-child(1){display:none}.header .header-right .box-right.show-in-split{display:flex}.header .header-right .box-right .box-right-content{display:flex;align-items:center;justify-content:center}.header .header-right .box-right .box-right-content .icon-sm{width:.6rem;height:.4rem;cursor:pointer;transition:opacity .2s ease}.header .header-right .box-right .box-right-content .icon-sm:hover{opacity:.8}.header .header-right .box-rect{height:.4rem;border-radius:.08rem;background:#4aaf8d;display:flex;align-items:center;justify-content:center}.header .header-right .box-rect .box-rect-content{display:flex;align-items:center}.header .header-right .box-rect .box-rect-content .icon-control{width:.2rem;height:.2rem;cursor:pointer!important;transition:opacity .2s ease}.header .header-right .box-rect .box-rect-content .icon-control:hover{opacity:.8}.header .header-right .box-rect-10{width:.6rem!important;height:.4rem;border-radius:.08rem;display:flex;align-items:center;justify-content:center;flex-shrink:0}.header .header-right .box-rect-10.active{width:.6rem!important;background:#f5b403;box-shadow:0 .02rem .04rem #0093b54d}.header .header-right .box-rect-10 .icon-playing{width:.2rem;height:.2rem;cursor:pointer;transition:opacity .2s ease}.header .header-right .box-rect-10 .icon-playing:hover{opacity:.8}.header .header-right .box-rect-4{width:1.8rem;height:.4rem;border-radius:.08rem;background:#4aaf8d;display:flex;align-items:center}.header .header-right .box-rect-4 .box-rect-9{width:.6rem;height:.4rem;background:#f5b403;border-radius:.08rem 0 0 .08rem;display:flex;align-items:center;justify-content:center;flex-shrink:0}.header .header-right .box-rect-4 .box-rect-9 .icon-zhangjie{width:.2rem;height:.2rem;cursor:pointer;transition:opacity .2s ease}.header .header-right .box-rect-4 .box-rect-9 .icon-zhangjie:hover{opacity:.8}.header .header-right .box-rect-4 .box-text{flex:1;height:.4rem;display:flex;align-items:center;justify-content:center}.header .header-right .box-rect-4 .box-text span{color:#fff;font-family:Microsoft YaHei;font-size:.16rem;font-weight:400;line-height:.21rem;letter-spacing:.05rem;text-align:center}.header .header-right .box-rect-time{width:1.85rem;margin-left:.32rem}.header .header-right .box-rect-time .box-text span{letter-spacing:0}.header .header-right .box-rect-5{width:1.45rem}.header .header-right .box-rect-5 .box-text span{letter-spacing:0}.header .header-right .box-rect-5 .box-arrows{display:flex;flex-direction:column;gap:.04rem;padding-right:.1rem}.header .header-right .box-rect-5 .box-arrows .icon-arrow{width:.1rem;height:.1rem;cursor:pointer;transition:opacity .2s ease}.header .header-right .box-rect-5 .box-arrows .icon-arrow:hover{opacity:.8}.header .header-right .box-rect-11{width:.65rem;height:.4rem;border-radius:.08rem;background:#4aaf8d;display:flex;align-items:center;justify-content:center}.header .header-right .box-rect-11 span{color:#fff;font-family:Microsoft YaHei;font-size:.16rem;font-weight:400;line-height:.21rem;letter-spacing:0;text-align:left}.main-content{width:calc(100vw - 1.4rem);height:9.34rem;border-radius:.2rem;box-shadow:0 .04rem .04rem #00000026;background:#fff;margin:.8rem .7rem 0;display:flex;overflow-y:auto;position:relative}.main-content .global-loading-prompt{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;z-index:10}.main-content .global-loading-prompt p{color:#000;font-family:Noto Sans SC;font-size:.2rem;font-weight:500;line-height:.28rem;margin:0}.main-content .content-left{width:2.68rem;height:100%;background-image:url(./bg-track-CX_IGiGs.png)!important;background-size:cover!important;background-repeat:no-repeat!important;background-position:center!important}.main-content .content-left.original-spectrum-mode{opacity:0;pointer-events:none;-webkit-user-select:none;user-select:none}.main-content .content-left .random-instrument-btn{width:1.62rem;height:.6rem;background:#4aaf8d;border-radius:.12rem;display:flex;align-items:center;padding:0 .105rem 0 .15rem;cursor:pointer;transition:opacity .2s ease;margin-top:.28rem;margin-left:.48rem}.main-content .content-left .random-instrument-btn:hover{opacity:.8}.main-content .content-left .random-instrument-btn.disabled{opacity:.5;pointer-events:none;cursor:not-allowed}.main-content .content-left .random-instrument-btn .random-icon{width:.36rem;height:.36rem;margin-right:.12rem;display:block}.main-content .content-left .random-instrument-btn .random-text{height:.3rem;color:#fff;font-family:Noto Sans SC;font-size:.21rem;font-weight:500;line-height:.3rem;letter-spacing:0;text-align:left;display:block}.main-content .content-left .track-section{width:2.04rem;display:flex;flex-direction:row;align-items:center;margin-left:.32rem;border-bottom:.01rem solid rgb(237,237,237)}.main-content .content-left .track-section.no-border-bottom{border-bottom:none}.main-content .content-left .track-section.disabled-track{opacity:.5;cursor:not-allowed;pointer-events:none}.main-content .content-left .track-section.disabled-track .instrument-icon{opacity:.6}.main-content .content-left .track-section.disabled-track:hover .track-hover-box{display:none}.main-content .content-left .track-section .track-icon{width:1.08rem;height:1.08rem;background:#fff;border-radius:.08rem;display:flex;align-items:center;justify-content:center;position:relative;cursor:pointer;box-sizing:border-box;border:.02rem solid rgb(74,175,141)}.main-content .content-left .track-section .track-icon .track-index-icon{position:absolute;bottom:.054rem;right:.054rem;width:.108rem;height:.108rem}.main-content .content-left .track-section .instrument-icon{width:.72rem;height:.72rem}.main-content .content-left .track-section .track-controls-left{display:flex;flex-direction:column;align-items:center}.main-content .content-left .track-section .track-controls-icons{width:100%;display:flex;align-items:center;margin-bottom:.12rem}.main-content .content-left .track-section .track-controls-icons .track-mini-icon{width:.28rem;height:.28rem;cursor:pointer;transition:all .2s ease}.main-content .content-left .track-section .track-controls-icons .track-mini-icon:hover{opacity:.8}.main-content .content-left .track-section .track-controls-icons .track-mini-icon:nth-child(1){margin-right:.08rem}.main-content .content-left .track-section .track-controls-icons .track-mini-icon:nth-child(2){margin-right:.14rem}.main-content .content-left .track-section .track-controls-icons .track-eq-container{width:.46rem;height:.28rem;display:flex;align-items:center;justify-content:center}.main-content .content-left .track-section .track-controls-icons .track-eq-container .track-eq-icon{width:100%;height:100%;object-fit:contain}.main-content .content-left .track-section .track-volume-slider{width:1.24rem;position:relative;display:flex;align-items:center;justify-content:center}.main-content .content-left .track-section .track-volume-slider .track-slider-bar{width:1.24rem;height:.06rem;box-sizing:border-box;border-radius:.06rem;box-shadow:0 .01rem .01rem #fff,inset 0 .01rem .01rem #00000040;position:relative;overflow:hidden}.main-content .content-left .track-section .track-volume-slider .track-slider-bar .track-slider-fill{position:absolute;top:0;left:0;height:100%;background:linear-gradient(to right,#2b2b2b,#606060)}.main-content .content-left .track-section .track-volume-slider .track-slider-node{position:absolute;width:.336rem;height:.42rem;top:-.098rem;display:flex;align-items:center;justify-content:center;cursor:pointer;-webkit-user-select:none;user-select:none}.main-content .content-left .track-section .track-volume-slider .track-slider-node .track-slider-icon{width:100%;height:100%;object-fit:contain}.main-content .content-left .track-section .track-controls-right{width:.6rem;height:.6rem;margin-left:.2rem;box-sizing:border-box;border-radius:.08rem;background:#fff;border:.0111rem solid rgb(74,175,141);display:flex;align-items:center;justify-content:center;cursor:pointer;position:relative;flex-shrink:0}.main-content .content-left .track-section .track-controls-right .track-instrument-icon{width:.4rem;height:.4rem;object-fit:contain}.main-content .content-left .track-section .track-controls-right .track-index-icon{position:absolute;bottom:.03rem;right:.03rem;width:.06rem;height:.06rem}.main-content .content-left .track-section .track-hover-box{position:absolute;top:50%;left:1.08rem;transform:translateY(-50%);width:2.1rem;min-height:1.08rem;max-height:3rem;box-sizing:border-box;border:.005rem solid rgb(74,175,141);border-radius:.08rem;background:#fff;display:block;opacity:0;visibility:hidden;transition:all .2s ease;z-index:1000}.main-content .content-left .track-section .track-hover-box.active{opacity:1;visibility:visible}.main-content .content-left .track-section .track-hover-box .hover-content{width:100%;overflow-y:auto;max-height:2.8rem;overflow:visible}.main-content .content-left .track-section .track-hover-box .track-wrapper{position:relative;width:100%}.main-content .content-left .track-section .track-hover-box .track-info{display:flex;align-items:center;justify-content:flex-start;padding:.08rem .12rem;min-height:.4rem;width:100%;position:relative}.main-content .content-left .track-section .track-hover-box .track-info.selected-track .track-name,.main-content .content-left .track-section .track-hover-box .track-info.selected-track .instrument-name{color:#4aaf8d}.main-content .content-left .track-section .track-hover-box .track-details{display:flex;align-items:center;justify-content:space-between;gap:.12rem;flex:1}.main-content .content-left .track-section .track-hover-box .track-name{color:#000;font-family:Noto Sans SC;font-size:.14rem;font-weight:400;line-height:.2rem;letter-spacing:.02rem;text-align:left}.main-content .content-left .track-section .track-hover-box .instrument-name{color:#000;font-family:Noto Sans SC;font-size:.14rem;font-weight:400;line-height:.2rem;letter-spacing:.02rem;text-align:right}.main-content .content-left .track-section .arrow-icon{width:.2rem;height:.2rem;margin-left:.12rem}.main-content .content-right{position:absolute;width:12.5rem;height:100%;left:50%;transform:translate(-50%);display:flex;flex-direction:column;padding-top:.24rem;box-sizing:border-box}.main-content .content-right .button-area{position:absolute;top:.24rem;right:.24rem;width:1.32rem;height:.4rem;border-radius:.08rem;background:#4aaf8d;display:flex;z-index:1000}.main-content .content-right .button-area .button-item{width:50%;height:100%;display:flex;align-items:center;justify-content:center;color:#fff;font-family:Noto Sans SC;font-size:.14rem;font-weight:400;line-height:.2rem;letter-spacing:0;text-align:center;cursor:pointer;transition:background-color .2s ease;border-radius:.08rem}.main-content .content-right .button-area .button-item.active{background:#f5b403}.main-content .content-right .button-area .button-item:hover{opacity:.8}.main-content .content-right .song-title{color:#000;font-family:Noto Sans SC;font-size:.36rem;font-weight:700;line-height:.52rem;letter-spacing:.02rem;text-align:center;height:.52rem;display:flex;flex-direction:row;align-items:center;justify-content:flex-start;margin-left:4.95rem;margin-top:.1rem}.main-content .content-right .song-subtitle-author-container{position:relative;width:100%;height:.35rem;margin-top:.12rem;margin-bottom:.35rem}.main-content .content-right .song-subtitle{position:absolute;left:5.55rem;height:.35rem;display:flex;flex-direction:row;align-items:center;color:#000;font-family:Noto Sans SC;font-size:.24rem;font-weight:500;line-height:.35rem;letter-spacing:0;text-align:center}.main-content .content-right .song-author{position:absolute;left:11.46rem;height:.29rem;display:flex;flex-direction:row;align-items:center;color:#000;font-family:Noto Sans SC;font-size:.2rem;font-weight:400;line-height:.29rem;letter-spacing:0;text-align:right}.main-content .content-right .video-container{width:12.5rem;height:7rem}.main-content .content-right .video-container video{width:100%;height:100%;object-fit:contain}.main-content .content-right .video-placeholder{width:100%;height:100%;min-height:4rem;display:flex;align-items:center;justify-content:center;background:#f9f9f9}.main-content .content-right .video-placeholder p{color:#666;font-size:.16rem;text-align:center}.video-progress-container{width:11.68rem;height:.28rem;margin:.1rem 0 0 .67rem;padding:0}.video-progress-container .paragraph-progress-bar{width:11.68rem;height:.14rem;display:flex;align-items:center;margin-bottom:.08rem}.video-progress-container .paragraph-progress-bar.original-mode{opacity:0;pointer-events:none}.video-progress-container .paragraph-progress-bar .paragraph-section{height:100%;position:relative;opacity:.3;cursor:pointer}.video-progress-container .paragraph-progress-bar .paragraph-section.active{opacity:1}.video-progress-container .paragraph-progress-bar .paragraph-section .section-name{position:absolute;top:-.32rem;left:50%;transform:translate(-50%);color:#000;font-family:Noto Sans SC;font-style:Regular;font-size:.14rem;font-weight:700;line-height:.2rem;letter-spacing:0;text-align:center;white-space:nowrap}.video-progress-container .paragraph-progress-bar .paragraph-section.first-section{border-radius:.07rem 0 0 .07rem}.video-progress-container .paragraph-progress-bar .paragraph-section.last-section{border-radius:0 .07rem .07rem 0}.video-progress-container .paragraph-progress-bar .paragraph-section.section-a{background:#92a8fe}.video-progress-container .paragraph-progress-bar .paragraph-section.section-b{background:#ff96a7}.video-progress-container .paragraph-progress-bar .paragraph-section.section-c{background:#00abd1}.video-progress-container .paragraph-progress-bar .paragraph-section.section-d{background:#e39a56}.video-progress-container .paragraph-progress-bar .paragraph-section.section-e{background:#00d1aa}.video-progress-container .paragraph-progress-bar .paragraph-section.section-f{background:#00abd1}.video-progress-container .paragraph-progress-bar .paragraph-section.section-尾奏{background:#8ac5ff}.video-progress-container .video-progress-main{display:flex;align-items:center;gap:.12rem;margin-bottom:.08rem}.video-progress-container .video-progress-bar{flex:1;height:.06rem;background:#c8c8c8cc;border-radius:.03rem;cursor:pointer;position:relative;overflow:visible}.video-progress-container .video-progress-bar:hover{background:#b4b4b4e6}.video-progress-container .video-progress-bar .video-progress-fill{height:100%;background:#f5b403;border-radius:.03rem;position:relative}.video-progress-container .video-progress-bar .paragraph-separator{position:absolute;top:50%;transform:translate(-50%,-50%);width:.04rem;height:.2rem;border-radius:.06rem;background:#cbd2ed;z-index:5;pointer-events:none;display:none}.video-progress-container .video-progress-bar .video-progress-slider{position:absolute;top:50%;transform:translateY(-50%);width:.16rem;height:.16rem;background:#fff;border:.03rem solid rgb(74,175,141);border-radius:50%;cursor:grab;z-index:10;box-shadow:0 .02rem .08rem #0000004d}.video-progress-container .video-progress-bar .video-progress-slider.dragging{transition:none!important;cursor:grabbing}.video-progress-container .video-progress-bar .video-progress-slider:not(.dragging){transition:transform .2s ease,box-shadow .2s ease}.video-progress-container .video-progress-bar .video-progress-slider:hover{transform:translateY(-50%) scale(1.1);box-shadow:0 .03rem .12rem #0006}.video-progress-container .video-progress-bar .video-progress-slider:active{cursor:grabbing;transform:translateY(-50%) scale(.95);box-shadow:0 .01rem .04rem #0003}.video-progress-container .video-play-pause-btn{width:.36rem;height:.36rem;border-radius:50%;background:#4aaf8d;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease;flex-shrink:0}.video-progress-container .video-play-pause-btn:hover{background:#3e9678;transform:scale(1.05)}.video-progress-container .video-play-pause-btn:active{transform:scale(.95)}.video-progress-container .video-play-pause-btn .video-control-icon{width:.2rem;height:.2rem;filter:brightness(0) invert(1)}.video-progress-container .video-time-display{display:flex;justify-content:space-between;align-items:center;padding:0 .08rem}.video-progress-container .video-time-display .current-time,.video-progress-container .video-time-display .duration{color:#666;font-family:Arial,sans-serif;font-size:.14rem;font-weight:400}.video-progress-container .video-time-display .current-time{color:#f5b403;font-weight:600}.bottom-controls-wrapper{position:absolute;bottom:-.4rem;left:0;right:0;z-index:1000;pointer-events:none}.bottom-controls-wrapper>*{pointer-events:auto}.instrument-panel{position:absolute!important;top:50%!important;left:2.5rem!important;transform:translateY(-50%)!important;width:4.9978rem!important;height:4.57rem!important;background-image:url(./icon-panel-CQjmpIWX.png)!important;background-size:cover!important;background-repeat:no-repeat!important;background-position:center!important;z-index:100!important;padding:0!important;gap:0!important}.instruments-list{position:relative;width:100%;height:100%;display:block}.instrument-item{position:absolute!important;width:.8rem!important;height:.8rem!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;cursor:pointer!important;transition:all .2s ease!important;border-radius:50%!important}.instrument-item:nth-child(1){left:.62rem!important;top:.75rem!important;background:#954ecf!important}.instrument-item:nth-child(2){left:1.63rem!important;top:.31rem!important;background:#566be1!important}.instrument-item:nth-child(3){left:2.93rem!important;top:.42rem!important;background:#a5396b!important}.instrument-item:nth-child(4){left:3.77rem!important;top:1.14rem!important;background:#cd455e!important}.instrument-item:nth-child(5){left:3.95rem!important;top:2.2rem!important;background:#f7931e!important}.instrument-item:nth-child(6){left:3.55rem!important;top:3.2rem!important;background:#f5b403!important}.instrument-item:nth-child(7){left:2.53rem!important;top:3.66rem!important;background:#22b9a1!important}.instrument-item:nth-child(8){left:1.53rem!important;top:1.7rem!important;background:#3dcece!important}.instrument-item:nth-child(9){left:2.46rem!important;top:2.49rem!important;background:#d47329!important}.instrument-item:hover{transform:scale(1.1)!important}.instrument-icon{width:.4418rem!important;height:.4418rem!important;display:flex!important;align-items:center!important;justify-content:center!important;margin-bottom:.08rem!important}.instrument-img{width:100%!important;height:100%!important;object-fit:contain!important}.instrument-name{height:.15rem!important;color:#fff!important;font-family:Noto Sans SC!important;font-size:.1rem!important;font-weight:400!important;line-height:.14rem!important;letter-spacing:.02rem!important;text-align:center!important}.track-controls-right.drag-over{border:.02rem dashed rgb(74,175,141)!important;background-color:#4aaf8d1a!important;box-shadow:0 0 .1rem #4aaf8d4d!important}.instrument-item{cursor:grab!important}.instrument-item:active{cursor:grabbing!important}.instrument-item[draggable=true]:hover{opacity:.8!important}*{margin:0;padding:0;box-sizing:border-box}html,body{height:100%;overflow:hidden}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;line-height:1.6;color:#fff;background:#1a1a1a}::-webkit-scrollbar{width:.08rem}::-webkit-scrollbar-track{background:#ffffff1a;border-radius:.04rem}::-webkit-scrollbar-thumb{background:#ffffff4d;border-radius:.04rem}::-webkit-scrollbar-thumb:hover{background:#ffffff80}input[type=text],input[type=search],input[type=email],input[type=password]{background:#ffffff1a;border:.01rem solid rgba(255,255,255,.2);color:#fff;padding:.08rem .12rem;border-radius:.06rem;font-size:.14rem;transition:all .3s ease}input[type=text]:focus,input[type=search]:focus,input[type=email]:focus,input[type=password]:focus{outline:none;border-color:#667eea;background:#ffffff26}input[type=text]::placeholder,input[type=search]::placeholder,input[type=email]::placeholder,input[type=password]::placeholder{color:#fff9}button{font-family:inherit;font-size:inherit;cursor:pointer;transition:all .3s ease}button:focus{outline:none}button:disabled{opacity:.5;cursor:not-allowed}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.d-flex{display:flex}.d-block{display:block}.d-none{display:none}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.justify-around{justify-content:space-around}.justify-end{justify-content:flex-end}.align-center{align-items:center}.align-start{align-items:flex-start}.align-end{align-items:flex-end}.flex-column{flex-direction:column}.flex-row{flex-direction:row}.flex-1{flex:1}.flex-grow-1{flex-grow:1}.flex-shrink-0{flex-shrink:0}.w-100{width:100%}.h-100{height:100%}.mb-1{margin-bottom:.04rem}.mb-2{margin-bottom:.08rem}.mb-3{margin-bottom:.12rem}.mb-4{margin-bottom:.16rem}.mb-5{margin-bottom:.2rem}.mt-1{margin-top:.04rem}.mt-2{margin-top:.08rem}.mt-3{margin-top:.12rem}.mt-4{margin-top:.16rem}.mt-5{margin-top:.2rem}.p-1{padding:.04rem}.p-2{padding:.08rem}.p-3{padding:.12rem}.p-4{padding:.16rem}.p-5{padding:.2rem}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideInUp{0%{transform:translateY(.2rem);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.fade-in{animation:fadeIn .3s ease-in-out}.slide-in-up{animation:slideInUp .3s ease-out}.pulse{animation:pulse 2s infinite}@media (max-width: 1200px){.app-container .toolbar .search-bar{width:2rem}}@media (max-width: 768px){.app-container .main-content .sidebar{width:2rem}.app-container .main-content .content{padding:.15rem}.app-container .main-content .content .content-header{flex-direction:column;align-items:flex-start;gap:.15rem}.app-container .player .player-left{width:auto;min-width:2rem}.app-container .player .player-right{width:auto;min-width:1.5rem}}@media (max-width: 480px){.app-container .toolbar .search-bar{width:1.2rem}.app-container .toolbar .toolbar-right .btn-icon:last-child{margin-right:.1rem}.app-container .main-content{flex-direction:column}.app-container .main-content .sidebar{width:100%;height:auto;order:2}.app-container .main-content .content{order:1}.app-container .player{padding:.1rem}.app-container .player .player-left{display:none}.app-container .player .player-center .player-progress{max-width:3rem}.app-container .player .player-right .volume-control .volume-slider{width:.6rem}}