*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body{width:100%;height:100%}body{font-family:monospace}ul,ol{list-style:none}a{text-decoration:none;color:inherit}button{cursor:pointer;background:0 0;border:none}img{display:block;max-width:100%;height:auto}input{outline:none;border:none;font-family:inherit;font-size:1rem}main{max-width:30rem;margin:0 auto;padding:2rem;font-size:1rem}section.day{position:relative}section.day.drop-target:after{content:"";position:absolute;outline:.25rem solid #6495ed;outline-offset:1rem;pointer-events:none;border-radius:1rem;width:100%;height:100%;top:0;left:0}section.day:not(:last-child){margin-bottom:4rem}section.day .heading{display:flex;border-bottom:.125rem solid #000;justify-content:space-between;align-items:baseline}section.day .heading h2{font-size:1.5rem;font-weight:400;line-height:2.5rem}section.day .heading p{font-size:1rem}section.day ul{display:grid;grid-template-columns:2rem auto 3rem;grid-template-rows:auto}section.day ul .todo{display:grid;grid-template-columns:subgrid;grid-column:1/4;position:relative;align-items: center;height:3rem}section.day ul .todo.dragging{opacity:.75;z-index:1;cursor:grabbing;scale:1.05}section.day ul .todo:after{content:"";position:absolute;border-bottom:1px solid #000;width:100%;bottom:1px;left:0}section.day ul .todo.done .title{text-decoration:line-through;color:gray}section.day ul .todo .title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-left:.5rem}section.day ul .todo.new{display:grid;grid-template-columns:subgrid;grid-column:1/4}section.day ul .todo.new form{grid-column:2/4;height:100%}section.day ul .todo.new form input{width:100%;height:100%;padding-left:.5rem}:is(button,.button).delete{width:100%;height:100%}:is(button,.button).delete svg{width:1rem}@media (pointer:coarse){*{user-select:none;-webkit-tap-highlight-color:transparent;touch-action:pan-y pan-x}}