@import"https://fonts.googleapis.com/css2?family=Josefin+Sans:ital,wght@0,100..700;1,100..700&display=swap";*,*:before,*:after{padding:0;margin:0;box-sizing:border-box}html{-moz-text-size-adjust:none;-webkit-text-size-adjust:none;text-size-adjust:none}body,h1,h2,h3,h4,p,figure,blockquote,dl,dd{margin:0}ul[role=list],ol[role=list]{list-style:none}body{min-height:100vh;line-height:1.5}h1,h2,h3,h4,button,input,label{line-height:1.1}h1,h2,h3,h4{text-wrap:balance}a:not([class]){text-decoration-skip-ink:auto;color:currentColor}img,picture{max-width:100%;display:block}input,button,textarea,select{font:inherit}textarea:not([rows]){min-height:10em}:target{scroll-margin-block:5ex}:root{--brightBlue: hsl(220, 98%, 61%);--checkBG: linear-gradient(hsl(192, 100%, 67%), hsl(280, 87%, 65%));--lightGrey: hsl(0, 0%, 98%);--veryLightGrayishBlue: hsl(236, 33%, 92%);--lightGrayishBlue:hsl(233, 11%, 84%);--darkGrayishBlue: hsl(236, 9%, 61%);--veryDarkGrayishBlue: hsl(235, 19%, 35%);--veryDarkBlue: hsl(235, 21%, 11%);--veryDarkDesaturatedBlue: hsl(235, 24%, 19%);--lightGrayishBlueHover: hsl(236, 33%, 92%)}body{font-size:18px;font-family:Josefin Sans,serif;background:var(--lightGrey);font-weight:300}.dark{color:var(--lightGrey);background:var(--veryDarkBlue)}.dark main .todo-container{color:var(--darkGrayishBlue)}.dark main .todo-container .todo-body{box-shadow:1px 5px 10px 2px var(--veryDarkBlue)}.dark main .todo-container .todo-body .todo-item #checked{border-color:var(--veryDarkBlue)}.dark main .todo-container button{color:var(--lightGrey)}.dark main .todo-container .filters-block,.dark main .todo-container .todo-item{background:var(--veryDarkDesaturatedBlue)}.dark main .todo-container .filters-block .filters .active-filter,.dark main .todo-container .todo-item .filters .active-filter{color:var(--brightBlue);font-size:12px;font-weight:600}.dark main .todo-container .todo-input input{color:var(--lightGrey);background:var(--veryDarkDesaturatedBlue)}.dark main .todo-container .info-block{color:var(--darkGrayishBlue)}.dark main:before{background-image:url(/assets/bg-desktop-dark-DzAvO98h.jpg)}main{position:relative;display:flex;justify-content:center;align-items:center;padding:1em;z-index:5}main:before{content:"";position:absolute;left:0;top:0;width:100%;height:200px;background-image:url(/assets/bg-desktop-light-BIdKokTn.jpg);background-size:cover;z-index:-1}.todo-container{padding-top:1.75em;max-width:360px;width:100%}button,input{background:transparent;border:none;outline:none}button{cursor:pointer}.info-block{text-align:center;padding-top:2.8em;font-size:10px}.filters .active-filter{color:var(--brightBlue);font-size:12px;font-weight:600}._todo-title_1h1qh_1{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5em}._todo-title_1h1qh_1 h1{color:#fff;font-size:1.7rem;letter-spacing:.3em;text-transform:uppercase}._todo-title_1h1qh_1 ._todo-theme_1h1qh_14{width:18px;height:18px}.todo-input{position:relative}.todo-input input{height:44px;font-size:12px;width:100%;padding:.25em 3.7em;border-radius:5px;background:#fff}.todo-input button{color:#fff;position:absolute;font-size:16px;right:0;z-index:1;width:44px;height:44px;background:var(--darkGrayishBlue);border-radius:0 5px 5px 0}.filters-block{display:flex;justify-content:space-between;align-items:center;height:42px;font-size:10px;width:100%;padding:1.5em;border-radius:0 0 5px 5px;background:#fff}.filters-block .filters button{margin-right:1.5em}.todo-body{margin-top:.9em;box-shadow:1px 5px 10px 2px var(--darkGrayishBlue)}.todo-body .todo-item{display:flex;justify-content:space-between;align-items:center;height:42px;font-size:10px;width:100%;padding:1.5em;background:#fff;border-bottom:1px solid var(--darkGrayishBlue)}.todo-body .todo-item .check{cursor:pointer;width:17px;height:17px;border:1px solid var(--lightGrayishBlue);border-radius:50%}.todo-body .todo-item .check svg{vertical-align:middle}.todo-body .todo-item #checked{background:var(--checkBG);color:var(--lightGrey)}.todo-body .todo-item:first-child{border-radius:5px 5px 0 0}.todo-body .todo-item p{padding:0 15px;font-size:14px;flex-grow:1}.todo-body .todo-item .delete{font-size:16px}.done{color:var(--darkGrayishBlue);text-decoration:line-through}