@import url("https://fonts.googleapis.com/css2?family=Satisfy&display=swap");:root{--box-shadow:-1px 1px 0px 0px rgba(0,0,0,1);--border-radius:5px;--controller-bg:linear-gradient(to bottom left,#999696,#333333);--controller-body-bg:linear-gradient(to bottom left,rgb(44,44,44),rgb(20,20,20));--btn-dimensions:50px}.controller__body__section3{width:100%;height:50%}.controller_btn_box_shadow_round{cursor:pointer;grid-area:b;width:35px;height:35px}.controller_btn,.controller_btn_box_shadow_round{position:relative;justify-self:center;align-self:center}.controller_btn{width:24px;height:12px;border-radius:4px;transition:all .2s ease-in-out}.controller_btn__channel{background:radial-gradient(circle at top right,rgb(31,30,30),rgb(20,20,20) 70%,rgb(10,10,10))}.controller_btn_animation:active{transform:translate(-1px,1px)}.controller_btn__power{background:radial-gradient(circle at top right,rgba(255,50,50,1),rgba(202,0,0,1) 70%,rgb(31,30,30))}.controller_btn__label{position:absolute;top:-12px;left:50%;transform:translateX(-50%);font-size:10px;color:white}.controller__body__section3{padding-top:30px;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:2fr 2fr 1fr;grid-template-areas:"a b" "c c" "d d"}.shadow_round_left{grid-area:a}.shadow_round_right{grid-area:b}.controller__btn__shadow_show{box-shadow:-1px 1px 0 0 rgba(0,0,0,1);grid-area:c;position:relative;width:44px;height:10px;border-radius:5px;justify-self:center;cursor:pointer}.controller__btn__play{grid-area:a;background:radial-gradient(circle at top right,rgba(71,170,114,1),rgb(51,150,94) 70%,rgb(31,30,30))}.controller__btn__mute,.controller__btn__play{display:flex;justify-content:center;align-items:center;position:relative;width:35px;height:35px;border-radius:50%;justify-self:center;align-self:center}.controller__btn__mute{grid-area:b;background:radial-gradient(circle at top right,rgba(255,50,50,1),rgba(202,0,0,1) 70%,rgb(31,30,30))}.controller__btn__mute svg{color:white;font-size:20px}.controller__btn__show{width:44px;height:10px;border-radius:5px;background:radial-gradient(circle at top right,rgba(250,180,31,1),rgb(230,160,11) 70%,rgb(31,30,30));justify-self:center}.controller__body__section3_label{grid-area:d;justify-self:center;align-self:center;position:relative}.controller__body__bottom{width:100%;height:10%;justify-self:center;align-self:center;text-align:center;margin-top:.5rem}.controller__body__bottom p:first-child{font-family:Satisfy,cursive}