.product{position:relative;margin:10px 0;padding:12px;border-radius:12px;background:#f3f5f1}.remove-product{position:absolute;top:5px;right:6px;border:0;background:transparent;color:var(--red);font-size:10px}.product>.p-name{padding-right:45px}.add-product{width:100%;padding:10px;border:1px dashed var(--accent);border-radius:10px;background:transparent;color:var(--accent);font-weight:800}.todo-list{display:grid;gap:12px}.todo-card{width:100%;padding:16px;border:1px solid var(--line);border-radius:17px;background:var(--card);color:var(--ink);text-align:left;box-shadow:var(--shadow)}.todo-title{display:flex;justify-content:space-between;gap:10px;margin-bottom:10px}.todo-title span{color:var(--accent);font-size:11px;font-weight:800}.todo-card>small{color:var(--muted);line-height:1.6}.progress{display:grid;grid-template-columns:repeat(7,1fr);margin-top:14px}.progress button{display:grid;justify-items:center;gap:3px;padding:2px 0;border:0;background:transparent;color:var(--muted);font:inherit;cursor:pointer}.progress i{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--line);font-size:8px;font-style:normal}.progress small{font-size:7px;text-align:center}.progress .done{color:var(--accent)}.progress .done i{background:var(--accent);color:#fff}@media(max-width:520px){.app-header nav button{padding:4px;font-size:9px}.progress small{font-size:6px}}