.section-rect.design{background-color:var(--o-500);background:linear-gradient(135deg,var(--o-500),var(--r-500))}.section-rect.design .design-elements{display:flex;flex-direction:column-reverse}.section-rect.design .design-elements .section-text p{margin-bottom:3rem}.section-rect.design .design-elements .section-text .design-components{display:flex;flex-direction:column}.section-rect.design .design-elements .section-text .design-components .player-wrap{position:relative;background-image:url(../img/noise.svg);background-size:575px;border:1px solid var(--r-300);width:250px;height:fit-content;padding:3rem .5rem .5rem;margin-left:1.5rem;border-radius:2rem;box-shadow:0 25px 50px -12px rgb(0 0 0 / .1);transform:rotate(-.5deg)}.section-rect.design .design-elements .section-text .design-components .player-wrap>p{position:absolute;right:20px;top:-12px;font-size:2.125rem;letter-spacing:1px;color:var(--w-50);opacity:.75;pointer-events:none}.section-rect.design .design-elements .section-text .design-components .player-wrap .interaction-zone{padding:.875rem 1rem;margin:auto;background:rgb(0 0 0 / .1);backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;border-radius:1.5rem}.section-rect.design .design-elements .section-text .design-components .player-wrap .interaction-zone .song-texts p{font-size:.875rem;line-height:1.125rem;margin-bottom:0;font-weight:300;color:var(--w-100)}.section-rect.design .design-elements .section-text .design-components .player-wrap .interaction-zone .img-wrap{width:40px;height:40px;background:var(--w-100);border-radius:99px;padding:.75rem .7rem .75rem .8rem;margin-left:auto;opacity:.875;cursor:pointer;-webkit-tap-highlight-color:transparent}.section-rect.design .design-elements .section-text .design-components .player-wrap .interaction-zone .progress-track{width:100%;width:calc(100% - 15px);margin:1.25rem auto auto;height:3px;background:rgb(0 0 0 / .25);border-radius:99px}.section-rect.design .design-elements .section-text .design-components .player-wrap .interaction-zone .progress-track .progress-bar{width:0;height:100%;background:rgb(255 255 255 / .75);border-radius:99px}.section-rect.design .design-elements .section-text .design-components .player-wrap .interaction-zone input[type=range]{width:100%;opacity:0;-webkit-appearance:none;-webkit-tap-highlight-color:transparent;height:15px;outline:0;margin-top:-9px;cursor:pointer}.section-rect.design .design-elements .section-text .design-components .player-wrap .interaction-zone input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:15px;height:15px}.section-rect.design .design-elements .section-text .design-components .player-wrap .interaction-zone input[type=range]::-moz-range-thumb{width:15px;height:15px}.section-rect.design .design-elements .calendar-wrap{pointer-events:none;padding:3rem 1.5rem;width:100%;border-radius:2rem;background:var(--w-50);margin:0 auto 3rem;border:1px solid var(--w-200);border-bottom:5px solid var(--w-200);box-shadow:0 20px 25px -5px rgb(0 0 0 / .075),0 8px 10px -6px rgb(0 0 0 / .125)}.section-rect.design .design-elements .calendar-wrap h3{text-align:center;font-size:2rem;font-weight:600;margin-bottom:2rem;color:var(--w-800)}.section-rect.design .design-elements .calendar-wrap .days-list{display:grid;grid-template-columns:repeat(7,1fr);text-align:center;margin-bottom:.5rem}.section-rect.design .design-elements .calendar-wrap .days-list p{font-size:1rem;font-weight:600;margin-bottom:0;color:var(--w-800)}.section-rect.design .design-elements .calendar-wrap .days-grid{display:grid;grid-template-columns:repeat(7,1fr);grid-template-rows:repeat(5,1fr)}.section-rect.design .design-elements .calendar-wrap .days-grid .calendar-day{height:50px;width:100%;min-width:35px;text-align:center;margin:0 auto;border-left:1px solid var(--w-100)}.section-rect.design .design-elements .calendar-wrap .days-grid .calendar-day:nth-child(7n-6){border-left:0}.section-rect.design .design-elements .calendar-wrap .days-grid .calendar-day.today{background:var(--o-500);border-radius:.75rem;border-width:0}.section-rect.design .design-elements .calendar-wrap .days-grid .calendar-day p{line-height:50px;font-size:1rem;color:var(--w-600);font-weight:400}.section-rect.design .design-elements .calendar-wrap .days-grid .calendar-day.other p{line-height:50px;font-size:1rem;color:var(--w-200);font-weight:400}.section-rect.design .design-elements .calendar-wrap .days-grid .calendar-day.today p{color:var(--w-50);font-weight:500}@media (min-width:768px){.section-rect.design .design-elements,.section-rect.design .design-elements .section-text .design-components{flex-direction:row}.section-rect.design .design-elements .calendar-wrap{padding:3rem 2rem;margin:-8rem 0 auto 8rem;transform:rotate(.5deg)}.section-rect.design .design-elements .calendar-wrap .days-grid .calendar-day{min-width:45px}}