.tool[data-tool=to-do-list-maker] .todo{gap:var(--space-3);display:grid}.tool[data-tool=to-do-list-maker] .add{gap:var(--space-3);align-items:end;display:grid}@media (min-width:40rem){.tool[data-tool=to-do-list-maker] .add{grid-template-columns:minmax(0,1fr) 9rem auto}}.tool[data-tool=to-do-list-maker] .bar,.tool[data-tool=to-do-list-maker] .foot{justify-content:space-between;align-items:center;gap:var(--space-3);flex-wrap:wrap;display:flex}.tool[data-tool=to-do-list-maker] .foot .meta-line{margin:0}.tool[data-tool=to-do-list-maker] .items{gap:var(--space-2);margin:0;padding:0;list-style:none;display:grid}.tool[data-tool=to-do-list-maker] .item{align-items:center;gap:var(--space-2);padding:var(--space-1) var(--space-2);border:1px solid var(--c-border);border-radius:var(--r-md);background:var(--c-surface-2);border-inline-start-width:5px;display:flex}.tool[data-tool=to-do-list-maker] .item.p-high{border-inline-start-color:var(--c-danger)}.tool[data-tool=to-do-list-maker] .item.p-normal{border-inline-start-color:var(--c-primary)}.tool[data-tool=to-do-list-maker] .item.p-low{border-inline-start-color:var(--c-border-strong)}.tool[data-tool=to-do-list-maker] .check{flex:none;block-size:24px;inline-size:24px;margin:8px}.tool[data-tool=to-do-list-maker] .text{background:0 0;border:0;flex:1;min-block-size:40px;min-inline-size:0}.tool[data-tool=to-do-list-maker] .item.done .text{color:var(--c-text-2);text-decoration:line-through}.tool[data-tool=to-do-list-maker] .item .btn{flex:none;min-block-size:40px;min-inline-size:40px}