:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{text-align:center;margin:0 auto}*{box-sizing:content-box}@media (width >= 768px){#root{max-width:100vw}}body{display:flex;margin:0;min-width:320px;min-height:100vh}header{margin-bottom:2rem;display:flex;align-items:center;justify-content:center;gap:1rem}.logo{padding:.3rem;background:#ffbf00;border-radius:.5rem}.item{display:flex;padding-inline:.5rem;align-items:center;transition:.4s;animation:fadeIn .8s forwards}.item:hover .action>*{display:flex}.item[data-completed=true] .status{background-image:url(check.svg);background-size:contain}.item[data-completed=true] .text{text-decoration:line-through}.status{margin-right:.5rem;padding:.2rem;width:.5rem;height:.5rem;border:.1rem solid white;border-radius:.2rem;background:transparent;cursor:pointer;transition:.4s;flex-shrink:0;opacity:.5}.status:hover{opacity:1}.status:disabled{cursor:default;opacity:.5}.text{flex-shrink:1;flex-grow:1;margin:0;padding:0;font-size:1rem;background-color:transparent;border:none;outline:none;line-height:1lh;transition:.4s}.text:focus+.action>*{display:flex}.action{flex-shrink:0;flex-basis:2.6rem;display:flex;align-items:flex-end;justify-content:flex-end}.close,.add-sub{display:none;justify-content:center;align-items:center;cursor:pointer}.hidden{animation:fadeOut .4s forwards}@keyframes fadeIn{0%{display:flex;opacity:0}to{opacity:1}}@keyframes fadeOut{to{display:none;opacity:0}}.list{display:flex;flex-direction:column;align-items:stretch;gap:1rem;width:min(300px)}details{display:contents}details:open summary:before{content:url(chevron-down.svg)}details .list{opacity:.5}summary{text-align:start;-webkit-user-select:none;user-select:none}summary:before{content:url(chevron-up.svg);position:relative;top:3px;left:-2px;transition:.4s}.list-button,summary{position:relative;padding:.5rem;display:flex;align-items:center;background-color:transparent;border:0;font-family:inherit;line-height:inherit;font-size:inherit;font-weight:inherit;cursor:pointer;opacity:.8}:is(.list-button,summary):hover{opacity:1}:is(.list-button,summary):after{content:"";background:#ffffff20;position:absolute;left:0;width:100%;height:100%;opacity:0;transition:1s}:is(.list-button,summary):active:after{opacity:1;transition:0s}
